JavaScript 是 Web 的编程语言。
所有现代的 HTML 页面都使用 JavaScript。
JavaScript 是脚本语言
JavaScript 是一种轻量级的编程语言。
JavaScript 是可插入 HTML 页面的编程代码。
JavaScript 插入 HTML 页面后,可由所有的现代浏览器执行。
HTML 页面引入JavaScript的三种方法:
1.写在页面中<head></head>标签或者<body></body>标签中,已<script></script>标签开头
2.直接在当前目录下新建一个.js的文件,在引入时<script src="xxx.js"></script>
注意:html文档的加载执行顺序,从上到下执行,建议js代码写在<body>部分
Js的输出语句:
1.console.log("hello world") //需要到浏览器的控制台查看 alert("hello world")//调用BOM对象下面的Window对象,弹出提示框
2.使用 innerHTML 写入到 HTML 元素。
<!DOCTYPE html> <html> <body> <h1>我的第一个 Web 页面</h1> <p id="demo">我的第一个段落</p> <script> document.getElementById("demo").innerHTML = "段落已修改。"; </script> </body> </html>
3.使用 document.write() 方法将内容写到 HTML 文档中。
<!DOCTYPE html> <html> <body> <h1>我的第一个 Web 页面</h1> <p>我的第一个段落。</p> <script> document.write(Date()); </script> </body> </html>
<--!请使用 document.write() 仅仅向文档输出写内容-->
<--!如果在文档已完成加载后执行 document.write,整个 HTML 页面将被覆盖-->
JS基础语法:
数据类型:Number(数字) 包含整数,小数,浮点数 ;String(字符串);Array(数组) ; Object(对象);Function(函数)
JS变量声明:ES5---var x,y=1,2;Es6-- let x 声明变量
/*
let允许你声明一个作用域被限制在块级中的变量、语句或者表达式。在Function中局部变量推荐使用let变量,避免变量名冲突。
作用域规则
let 声明的变量只在其声明的块或子块中可用,这一点,与var相似。二者之间最主要的区别在于var声明的变量的作用域是整个封闭函数。
*/
JS数据类型,对象:
值类型(基本类型):字符串(String)、数字(Number)、布尔(Boolean)、对空(Null)、未定义(Undefined)、Symbol。
引用数据类型:对象(Object)、数组(Array)、函数(Function)。
var a=123//数字 var a="hello world" //字符串 var a=true //布尔值 var a =Null //空值 var a;//Undefind
在 JavaScript中,几乎所有的事物都是对象,JavaScript 对象是拥有属性和方法的数据。声明对象的方法:
JS中使用{}来表示对象
//声明对象 <script> //声明方法1 var obj={name:"tang","func":add,"age":"23"} var obj={}; obj["name"]="alex" console.log(obj) //声明方法二 var objs=new Object() objs[name]="alex"; objs["age"]=20; console.log(objs) </scrpit>
JS中访问对象属性和方法
访问对象属性:
var obj={name:"tang",age:"20"};
console.log(obj.name,obj.["age"]);//使用对象下标 或 对象.属性来访问
访问方法
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>菜鸟教程(runoob.com)</title> </head> <body> <p>创建和使用对象方法。</p> <p>对象方法作为一个函数定义存储在对象属性中。</p> <p id="demo1"></p> <p id="demo2"></p> <script> var person = { firstName: "John", lastName : "Doe", id : 5566, fullName : function() { return this.firstName + " " + this.lastName; } }; func=person["fullName"]
document.getElementById("demo1").innerHTML = "不加括号输出函数表达式:" + person.fullName;
/*
不加括号输出函数表达式:function() { return this.firstName + " " + this.lastName; }
*/ document.getElementById("demo").innerHTML = person.fullName(); </script> </body> </html>
JS的作用域
JavaScript 作用域 在 JavaScript 中, 对象和函数同样也是变量。 在 JavaScript 中, 作用域为可访问变量,对象,函数的集合。 JavaScript 函数作用域: 作用域在函数内修改。 javascript局部作用域: 变量在函数内声明,变量为局部作用域。 局部变量:只能在函数内部访问。 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>菜鸟教程(runoob.com)</title> </head> <body> <p>局部变量在声明的函数外不可以访问。</p> <p id="demo"></p> <script> myFunction(); document.getElementById("demo").innerHTML = "carName 的类型是:" + typeof carName; function myFunction() { var carName = "Volvo"; } </script> </body> </html> 因为局部变量只作用于函数内,所以不同的函数可以使用相同名称的变量。 局部变量在函数开始执行时创建,函数执行完后局部变量会自动销毁。 javascript 全局变量 变量在函数外定义,即为全局变量。 全局变量有 全局作用域: 网页中所有脚本和函数均可使用。 如果变量在函数内没有声明(没有使用 var 关键字),该变量为全局变量。 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>菜鸟教程(runoob.com)</title> </head> <body> <p> 如果你的变量没有声明,它将自动成为全局变量: </p> <p id="demo"></p> <script> myFunction(); document.getElementById("demo").innerHTML = "我可以显示 " + carName; function myFunction() { carName = "Volvo"; } </script> </body> </html> 变量的声明周期: JavaScript 变量生命周期在它声明时初始化。 局部变量在函数执行完毕后销毁。 全局变量在页面关闭后销毁。 函数参数为局部变量,只对函数起作用
JS的判断语句及条件循环:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <script> //判断语句 var i=5 if (i<10) { console.log(i) } else{ alert("false") } //JS判断语句 if()---else if()--elseif()--else 注意:==是值想等 ===是全等及比较类型也想等 //JS循环 for while循环 for (var i=0;i<10;i++){ console.log(i) } var a=0 while (a>10){ console.log(a); a++; } //a++是先执行代码在加一 ++a是先加1在执行代码 a--、--a同理 //例子:通过for循环遍历数组 var arr=[1,2,3,4,5] for (i in arr ){ //将下标作遍历 console.log(arr[i]) } //length JS里面的对象都具有的属性 for (var i=0;i<arr.length;i++){ console.log(arr[i]) } </script> </body> </html>
、