标签：doctype on() not image 加载 插入 pre 元素 rap
JavaScript：网络脚本语言。可用于html和web，可插入html由浏览器执行
使用方法/环境：
1、写入HTML输出
1 <!DOCTYPE html> 2 <html> 3 <body> 4 5 <p> 6 JavaScript 能够直接写入 HTML 输出流中： 7 </p> 8 9 <script> 10 document.write("<h1>This is a heading</h1>"); 11 document.write("<p>This is a paragraph.</p>"); 12 </script> 13 14 <p> 15 您只能在 HTML 输出流中使用 <strong>document.write</strong>。 16 如果您在文档已加载后使用它（比如在函数中），会覆盖整个文档。 17 </p> 18 19 </body> 20 </html>
2、事件反应
<!DOCTYPE html>
<html>
<body>
<h1>我的第一段 JavaScript</h1>
<p>
JavaScript 能够对事件作出反应。比如对按钮的点击：
</p>
<button type="button" onclick="alert(‘Welcome!‘)">点击这里</button>
</body>
</html>
3、修改html内容
<!DOCTYPE html> <html> <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> </html>
4、改变 HTML 图像
<!DOCTYPE html> <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> </body> </html>
5、改变 HTML 样式
<!DOCTYPE html> <html> <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> </html>
6、常用于验证用户的输入
<!DOCTYPE html> <html> <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> </html>
参考：http://www.w3school.com.cn/js/index.asp
标签：doctype on() not image 加载 插入 pre 元素 rap
原文地址：https://www.cnblogs.com/wzk-0000/p/9761809.html
