目录目录 (1)1 js基础（1） (2)1.1 js写入html内容中 (2)1.2 点击button弹出欢迎界面 (2)1.3 点击button改变页面内容 (2)1.4 html内改变图像 (3)1.5 改变样式 (3)1.6 验证输入input内容 (4)1.7 <head>中的JavaScript 函数 (4)1.8 <body>中的JavaScript 函数 (4)1.9 外部的JavaScript 函数 (5)2 js基础（2） (5)2.1 document.getElementById(id)方法访问html元素 (5)2.2 声明js变量 (5)2.3 js数组 (6)2.4对象的两种寻址方式 (6)2.5 null清空变量 (7)2.6 对象的定义 (7)2.7创建js对象 (7)2.8 调用带参数的函数 (8)2.9 带有返回值的函数 (8)3 js基础（3） (8)3.1 switch语句 (8)3.2 for/in循环 (9)3.3 try catch测试和捕捉 (10)1 js基础（1）1.1 js写入html内容中</p><script>document.write("<h1>This is a heading</h1>");document.write("<p>This is a paragraph.</p>");</script><p>如果在文档已完成加载后执行document.write，整个HTML 页面将被覆盖。
1.2 点击button弹出欢迎界面<body><h1>我的第一段 JavaScript</h1><p>JavaScript 能够对事件作出反应。
比如对按钮的点击：</p><button type="button" onclick="alert('Welcome!')">点击这里</button> </body>1.3 点击button改变页面内容<body><h1>我的第一段 JavaScript</h1><p id="demo">JavaScript 能改变 HTML 元素的内容。
</p><script>function myFunction(){x=document.getElementById("demo"); // 找到元素x.innerHTML="Hello JavaScript!"; // 改变内容}</script><button type="button" onclick="myFunction()">点击这里</button></body>1.4 html内改变图像<body><script>function changeImage(){element=document.getElementById('myimage')if (element.src.match("bulbon")){element.src="/i/eg_bulboff.gif";}else{element.src="/i/eg_bulbon.gif";}}</script><img id="myimage" onclick="changeImage()" src="/i/eg_bulboff.gif"> <p>点击灯泡来点亮或熄灭这盏灯</p>1.5 改变样式<body><h1>我的第一段 JavaScript</h1><p id="demo">JavaScript 能改变 HTML 元素的样式。
</p><script>function myFunction(){x=document.getElementById("demo") // 找到元素x.style.color="#ff0000"; // 改变样式}</script><button type="button" onclick="myFunction()">点击这里</button></body>1.6 验证输入input内容<body><h1>我的第一段 JavaScript</h1><p>请输入数字。
如果输入值不是数字，浏览器会弹出提示框。
</p><input id="demo" type="text"><script>function myFunction(){var x=document.getElementById("demo").value;if(x==""||isNaN(x)){alert("Not Numeric");}}</script><button type="button" onclick="myFunction()">点击这里</button></body>1.7 <head>中的JavaScript 函数<head><script>function myFunction(){document.getElementById("demo").innerHTML="My First JavaScript Function"; }</script></head><body><h1>My Web Page</h1><p id="demo">A Paragraph.</p><button type="button" onclick="myFunction()">点击这里</button></body>1.8 <body>中的JavaScript 函数<body><h1>My First Web Page</h1><p id="demo">A Paragraph.</p><button type="button" onclick="myFunction()">点击这里</button><script>function myFunction(){document.getElementById("demo").innerHTML="My First JavaScript Function"; }</script></body>1.9 外部的JavaScript 函数<body><h1>My Web Page</h1><p id="demo">A Paragraph.</p><button type="button" onclick="myFunction()">点击这里</button><p><b>注释：</b>myFunction 保存在名为 "myScript.js" 的外部文件中。
</p><script type="text/javascript" src="/js/myScript.js"></script></body>2 js基础（2）2.1 document.getElementById(id)方法访问html元素<body><h1>My First Web Page</h1><p id="demo">My First Paragraph.</p><script>document.getElementById("demo").innerHTML="My First JavaScript";</script></body>2.2 声明js变量<body><p>点击这里来创建变量，并显示结果。
</p><button onclick="myFunction()">点击这里</button><p id="demo"></p><script>function myFunction(){var carname="Volvo";document.getElementById("demo").innerHTML=carname; }</script></body>2.3 js数组<body><script>var i;var cars = new Array();cars[0] = "Audi";cars[1] = "BMW";cars[2] = "V olvo";for (i=0;i<cars.length;i++){document.write(cars[i] + "<br>");}</script>2.4对象的两种寻址方式<body><script>var person={firstname : "Bill",lastname : "Gates",id : 5566};document.write(stname + "<br />"); document.write(person["lastname"] + "<br />");</script></body>2.5 null清空变量<body><script>var person;var car="Volvo";document.write(person + "<br />");document.write(car + "<br />");var car=nulldocument.write(car + "<br />");</script></body>2.6 对象的定义JavaScript 中的所有事务都是对象：字符串、数字、数组、日期，等等。