使用

在 HTML 中，JavaScript 代码必须位于 <script> 与 </script> 标签之间。

脚本可被放置与 HTML 页面的 <body> 或 <head> 部分中，或兼而有之；脚本也可放置与外部文件中。

外部脚本很实用，如果相同的脚本被用于许多不同的网页。

JavaScript 文件的文件扩展名是 .js。

如需使用外部脚本，请在 <script> 标签的 src (source) 属性中设置脚本的名称

输出

window.alert("弹出警告框")
document.write("<h1>写入到HTML文档</h1>")
console.log("写入到浏览器的控制台")

变量

  • JavaScript中用var关键字声明变量，它是一门弱类型语言，变量可以存放不同类型的值。
  • 建议使用驼峰命名法
  • var允许重名变量，let不允许重名，const声明常量，let只在代码块类有效，如for循环内
var x=20
x="张三"
alert(x)

数据类型

  • number: 数字（整数、小数、NaN）
  • string: 字符、字符串（单引号双引号皆可）
  • boolean
  • null
  • undefined: 声明的变量未初始化时，该变量的默认值为undefined
  • object: 对象

使用typeof操作符可以用来检查一个变量的数据类型。

  • Array用于定义数组
var 变量名 = new Array(元素1,元素2...)

或

var 变量名 = [元素列表]
  • Object类型，我们也称为一个对象，是JavaScript中的引用数据类型。
var 对象名称 = {
    属性名称1: 属性值1
    属性名称2: 属性值2
    ...
    
    函数定义...
}

或先定义对象，再添加属性：

var person = new Object();
person.name = "孙悟空";
person.age = 18;

运算符

特殊之处：

var x1=1
var x2="1"
/*
    ==：先转换为同种类型再比较其值
    ===：类型和值都相同才返回true
*/
console.log(x1==x2)     //true
console.log(x1===x2)    //false

函数

function FunctionName(参数1，参数2...) {
	执行代码
 }

或：

var FunctionName=function(参数1，参数2...) {
	执行代码
 }
  • 在JavaScript中，函数即对象
  • 参数不需要类型，因为JavaScript是弱类型语言
  • 返回值不需要定义类型，在函数体内直接使用return即可

如：

function add(a,b){
    return a+b;
}

DOM

javascript脚本 教程 js脚本入门_弱类型

通过 HTML DOM，JavaScript 能够访问和改变 HTML 文档的所有元素。

常用的有：document.getElementById(id)——通过元素 id 来查找元素

事件

HTML 事件是发生在 HTML 元素上的”事情”。

当在 HTML 页面中使用 JavaScript 时，JavaScript 能够“应对”这些事件。

<body>
    <input type="button" value="点击" id="btn">
    <script>
        document.getElementById("btn").onclick=function(){
            alert("按钮被点击")
        }
    </script>
</body>