javascript用什么软件编程,javascript用来做什么的

本文介绍了JavaScript的基础知识,包括其作为运行在浏览器的脚本语言,用途(如修改页面内容和表单验证),浏览器解析HTML和执行脚本的过程,以及内嵌式、外联式和行内JS的引用方式。同时讲解了input/output语句,如alert、prompt和document.write的用法。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

大家好,小编来为大家解答以下问题,javascript用什么软件编程,javascript用来做什么的,今天让我们一起来看看吧!

1、关于JavaScript

JavaScript是轻量级的编程语言,是一种运行在客户端浏览器中,由浏览器解析的脚本语言。
脚本语言:即不需要编译,直接可以被浏览器解析和执行Python解释器的安装步骤

在这里插入图片描述

2、JavaScript的组成结构

在这里插入图片描述

3、为什么学习 JavaScript?

JavaScript 是 web 开发人员必须学习的 3 门语言中的一门:

HTML 定义了网页的内容
CSS 描述了网页的布局
JavaScript 网页的行为

4、用JavaScript能做什么?

JavaScript可以用来修改页面内容,HTML图像,HTML样式,以及表单的验证。

5、浏览器解析页面的原理

第一步:浏览器向服务器发起请求,服务器接受请求后返回请求的页面文档

第二步:浏览器接收文档,开始从头解析(解析HTML文件)。

第三步:解析文档生成DOM,如果有CSS文件则会生成CSSDOM(加载外部脚本和样式表文件)

第四步:解析并执行脚本代码

第五步:解析完成文档后生成DOM树(触发DOMContentLoaded)

第六步:加载图片等外部文件

第六步:浏览器根据DOM树的内容计算出各个节点的位置和大小,绘制在浏览器上(页面加载完成,触发oad)

当从dom从上到下解析时,遇到标签会停止解析,转而去解析脚本,如果是内联的脚本,浏览器会先去执行这段内联脚本。如果是外链的,那会会先加载脚本js文件,后执行js文件。在处理完js脚本后,浏览器会继续解析HTML文档。

同样,Java执行也会收到标签CSS样式文件的影响。如果在标签前面有CSS样式文件,需css样式文件解析并加载完后才执行脚本,因为java可以查询对象的样式。

疑问:为什么CSS文件放在头部,将JS文件放到尾部?

因为浏览器生成DOM树时是一行一行读HTML代码的,标签放在最后面就不会影响前面的页面的渲染。

6、JavaScript的基本使用

HTML 中的脚本必须位于 标签之间。且脚本可被放置在 HTML 页面的<body>和<head>部分中。

6.1 JavaScript的引用方式
  • 内嵌式:将JS代码写在<>标签内,<>标签可放置于任何位置
< type="text/java">  
    alert(‘hello world!’) //alert()方法为弹出一个警告对话框 
</>  

  • 外联式:将JS代码写入外部JS文件中,通过<>标签内的src属性引入
< src="./index.js" type="text/java" charset="utf-8"></>  

  • 行内JS:直接将代码写在HTML元素内,该方法问题较多,不推荐使用
<button type="button" onclick="java:alert('hello world!')">click me</button> 

6.2 输入 / 输出语句
  • alert(): 创建一个警告对话框,参数内容为对话框文本
    例如:
    输出字符串
alert('hello world')

输出表达式

alert(1+1)

输出变量

var name = 'Alice'
alert('我是'+name)
  • prompt():创建一个提示对话框,用于收集用户输入,参数一为提示框文本
    内容,参数二为输入框的默认值(参数二可选)
prompt('你最喜欢的颜色是','红色')

或者有返回值,可将返回值存入变量再调用

var color = prompt('你最喜欢的颜色是','红色')
alert(color)
  • document.write():直接在页面上输出内容,参数除了可以是字符串、表达式变量,还可以是HTML标签代码
document.write('<h1>hello world</h1>')  

document.write()中可以使用转义字符,但无法使用\n换行符,如需换行,可使用<br>标签

document.write('hello' + '<br>' + 'world')  
  • JavaScript的调试,在浏览器中使用F12激活调试,然后选择console
    控制台输出:console.log()
    在这里插入图片描述
var a = 1  
var b = 2  
var c = a + b  
console.log(c) //控制台输出语句  

以上代码结果为:
在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值