JavaScript基础知识笔记
JavaScript 是属于 Web 的编程语言,对网页行为进行编程。
参考教程:
- https://www.w3school.com.cn/js/index.asp
- https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Language_overview
JavaScript 能够改变 HTML 内容
document.getElementById("demo").innerHTML = "Hello JavaScript";
JavaScript 能够改变 HTML 属性
<img id="myImage" border="0" src="/i/eg_bulboff.gif" style="text-align:center;">
<button onclick="document.getElementById('myImage').src='/i/eg_bulbon.gif'">开灯</button>
JavaScript 能够改变 HTML 样式 (CSS)
document.getElementById("demo").style.fontSize = "25px";
JavaScript 能够隐藏或显示 HTML 元素
document.getElementById("demo").style.display="none";
document.getElementById("demo").style.display="block";
JavaScript 使用
外部脚本引用
<script src="myScript.js"></script>
// myScript.js
function myFunction() {
document.getElementById("demo").innerHTML = "段落被更改。";
}
JavaScript 函数被放置于 HTML 页面
提示:把脚本置于 <body>
元素的底部,可改善显示速度,因为脚本编译会拖慢显示。
<!DOCTYPE html>
<html>
<body>
<h1>A Web Page</h1>
<p id="demo">一个段落</p>
<button type="button" onclick="myFunction()">试一试</button>
<script>
function myFunction() {
document.getElementById("demo").innerHTML = "段落被更改。";
}
</script>
</body>
</html>
基础语法
JavaScript区分大小写,用分号分隔语句;
在 JavaScript 中,首字符必须是字母、下划线(-)或美元符号($)。
注释
// 单行注释
/* 多行注释 */
数据类型
JavaScript支持动态类型。
var str1="hello world"; // String
var num=1; // Number
var x=true,y=false; // Boolean
var pets=["cat","dog"]; // Array
var person={name:"test",age="18"}; // Object
pets=null; // Undefined
对象
var person = {
// 对象属性
name:"test",
age="18",
id=666,
// 对象方法
get_id: function()
{
return this.id;
}
};
访问对象属性person.id;
或person["id"];
访问对象方法person.get_id();
不待()
则返回函数定义;
函数
function myFunction(var1, var2)
{
x = var1+var2;
return x;
}
var myVar=myFunction();