JavaScript 用法
HTML 中的脚本必须位于 <script> 与 </script> 标签之间。
脚本可被放置在 HTML 页面的 <body> 和 <head> 部分中
外部的js代码
也可以把脚本保存到外部文件中。外部文件通常包含被多个网页使用的代码。
外部 JavaScript 文件的文件扩展名是 .js。
如需使用外部文件,请在 <script> 标签的 "src" 属性中设置该 .js 文件:
注意外部脚本不能包含<script>标签
<!DOCTYPE html>
<html>
<body>
<script src="myScript.js"></script>
</body>
</html>
JS向页面输出类容
JavaScript 可以通过不同的方式来输出数据:
使用 window.alert() 弹出警告框。
使用 document.write() 方法将内容写到 HTML 文档中
一般用于测试,如果文档已经加载完成会覆盖整个文档,比如通过点击来触发这个事件那么真个文档就会被覆盖,因为点击事件是在页面加载完成后执行的
使用 innerHTML 写入到 HTML 元素。(会覆盖原有的类容)
<script>
document.getElementById("demo").innerHTML="我的第一个 JavaScript 函数";
</script>
使用 console.log() 写入到浏览器的控制台
console.log()的用处
主要是方便你调式javascript用的, 你可以看到你在页面中输出的内容。
相比alert他的优点是:
他能看到结构化的东西,如果是alert,弹出一个对象就是[object object],但是console能看到对象的内容。
console不会打断你页面的操作,如果用alert弹出来内容,那么页面就死了,但是console输出内容后你页面还可以正常操作。
Js常用数据类型
JavaScript 有多种数据类型:数字,字符串,数组,对象等等
var length = 16; // Number 通过数字字面量赋值
var points = x * 10; // Number 通过表达式字面量赋值
var lastName = "Johnson"; // String 通过字符串字面量赋值
var cars = ["Saab", "Volvo", "BMW"]; // Array 通过数组字面量赋值
var person = {firstName:"John", lastName:"Doe"}; // Object 通过对象字面量赋值
函数(Function)字面量 定义一个函数:
function myFunction(a, b) { return a * b;}
当您声明新变量时,可以使用关键词 "new" 来声明其类型:
var carname=new String;
var x= new Number;
var y= new Boolean;
var cars= new Array;
var person= new Object;
创建数组
var arr1 = new Array('a', 'b', 'c'); //这是一个预定义的数组,在创建时初始化
var arr2 = ['a', 'b', 'c' ]; //同样是在创建时初始化,但是这种创建更为简洁直观
var arr3 = new Array( ); var arr4 = [ ]; //这两种是创建空的数组
<script>
var i;
var cars = new Array();
cars[0] = "Saab";
cars[1] = "Volvo";
cars[2] = "BMW";
for (i=0;i<cars.length;i++)
{
document.write(cars[i] + "<br>");
}
</script>
对象的创建和寻址方式
<script>
var person=
{
firstname : "John",
lastname : "Doe",
id : 5566
};
document.write(person.lastname + "<br>");
document.write(person["lastname"] + "<br>");
</script>
对象中的方法
<script>
var person = {
firstName: "John",
lastName : "Doe",
id : 5566,
fullName : function()
{
return this.firstName + " " + this.lastName;
}
};
document.getElementById("demo").innerHTML = person.fullName();
</script>
Js中的字符串
Js代码的执行顺序和在在代码块中的语句的执行顺序
浏览器按照编写顺序依次执行每条语句。
代码块以左花括号开始,以右花括号结束,代码块的作用是一并地执行语句序列。
Js中的分号
在 HTML 中,JavaScript 语句向浏览器发出的命令,语句是用分号分隔:
分号用于分隔 JavaScript 语句。
通常我们在每条可执行的语句结尾添加分号。
使用分号的另一用处是在一行中编写多条语句。
<script>
a = 1;
b = 2;
c = a + b;
document.getElementById("demo1").innerHTML = c;
x = 1; y = 2; z = x + y;
document.getElementById("demo2").innerHTML = z;
</script>
Js函数
js函数声明语法
function functionname()
{
执行代码
}
或者
function functionname(parama...)
{
执行代码
}
或者
function functionname(parama...)
{
执行代码
return
}
小Demo
复选框的全选和全不选
var checkAll = false;
function allcheck(){
checkAll = !checkAll;
let inputs = document.getElementsByName('checkbox')
for(var i =0;i<inputs.length;i++){inputs[i].checked = checkAll}
}
js的作用域
局部变量:在函数中通过var声明的变量。
全局变量:在函数外通过var声明的变量。
没有声明就使用的变量,默认为全局变量,不论这个变量在哪被使用
局部变量在函数执行完毕后销毁,全局变量在页面关闭后销毁。
function func(){
undefined_var=110
}
函数内未声明即使用的变量情况:在 func() 被第一次调用之前, undefined_var 变量是不存在的即 undefined。func() 被调用过之后,undefined_var 成为全局变量。
网友评论