弹对话框
<script>window.alert(5 + 6);alert(5 + 6);</script><!DOCTYPE html><html><head><meta charset="utf-8"><title>测试实例</title><script>function myFunction(){alert("Hello World!");}</script></head><body><button onclick="myFunction()">点我</button></body></html>
确认框
<!DOCTYPE html><html><head><meta charset="utf-8"><title>阿西吧</title></head><body><p>点击按钮，显示确认框。</p><button onclick="myFunction()">点我</button><p id="demo"></p><script>function myFunction(){var x;var r=confirm("按下按钮!");if (r==true){x="你按下了\"确定\"按钮!";}else{x="你按下了\"取消\"按钮!";}document.getElementById("demo").innerHTML=x;}</script></body></html>
提示框
<!DOCTYPE html><html><head><meta charset="utf-8"><title>阿西吧</title></head><body><p>点击按钮查看输入的对话框。</p><button onclick="myFunction()">点我</button><p id="demo"></p><script>function myFunction(){var x;var person=prompt("请输入你的名字","Harry Potter");if (person!=null && person!=""){x="你好 " + person + "! 今天感觉如何?";document.getElementById("demo").innerHTML=x;}}</script></body></html>
换行
<!DOCTYPE html><html><head><meta charset="utf-8"><title>阿西吧</title></head><body><p>点击按钮在弹窗中使用换行。</p><button onclick="myFunction()">点我</button><p id="demo"></p><script>function myFunction(){alert("Hello\nHow are you?");}</script></body></html>
操作HTML元素
如需从 JavaScript 访问某个 HTML 元素，您可以使用 document.getElementById(id) 方法。
请使用 "id" 属性来标识 HTML 元素，并 innerHTML 来获取或插入元素内容：
<!DOCTYPE html><html><body><p id="demo">我的第一个段落</p><script>document.getElementById("demo").innerHTML = "段落已修改。";</script></body></html>
写HTML文档
<!DOCTYPE html><html><body><button onclick="myFunction()">点我</button><script>function myFunction() {document.write(Date());}</script></body></html>
写到控制台
<!DOCTYPE html><html><body><script>a = 5;b = 6;c = a + b;console.log(c);</script></body></html>
通过 id 查找 HTML 元素
<!DOCTYPE html><html><head><meta charset="utf-8"><title>阿西吧</title></head><body><p id="intro">你好世界!</p><p>该实例展示了 <b>getElementById</b> 方法!</p><script>x=document.getElementById("intro");document.write("<p>文本来自 id 为 intro 段落: " + x.innerHTML + "</p>");</script></body></html>
通过标签名查找 HTML 元素
<!DOCTYPE html><html><head><meta charset="utf-8"><title>阿西吧</title></head><body><p>你好世界!</p><div id="main"><p> DOM 是非常有用的。</p><p>该实例展示了 <b>getElementsByTagName</b> 方法</p></div><script>var x=document.getElementById("main");var y=x.getElementsByTagName("p");document.write('id="main"元素中的第一个段落为：' + y[0].innerHTML);</script></body></html>
通过类名找到 HTML 元素
<!DOCTYPE html><html><head><meta charset="utf-8"><title>阿西吧</title></head><body><p class="intro">你好世界!</p><p>该实例展示了 <b>getElementsByClassName</b> 方法!</p><script>x=document.getElementsByClassName("intro");document.write("<p>文本来自 class 为 intro 段落: " + x[0].innerHTML + "</p>");</script><p><b>注意：</b>Internet Explorer 8 及更早 IE 版本不支持 getElementsByClassName() 方法。</p></body></html>
元素插入内容
<!DOCTYPE html><html><head><meta charset="utf-8"><title>阿西吧</title></head><body><p id="p1">Hello World!</p><script>document.getElementById("p1").innerHTML="新文本!";</script><p>以上段落通过脚本修改文本。</p></body></html>
改变HTML属性
<!DOCTYPE html><html><head><meta charset="utf-8"><title>阿西吧</title></head><body><img id="image" src="smiley.gif" width="160" height="120"><script>document.getElementById("image").src="landscape.jpg";</script><p>原图片为 smiley.gif,脚本将图片修改为 landscape.jpg</p></body></html>
计时
setInterval() - 间隔指定的毫秒数不停地执行指定的代码。setTimeout() - 在指定的毫秒数后执行指定代码。setInterval()
第一个参数是函数（function）第二个参数间隔的毫秒数clearInterval() 方法用于停止 setInterval() 方法执行的函数代码
实例：实时显示当前时间
<!DOCTYPE html><html><head><meta charset="utf-8"><title>哎西吧</title></head><body><p>页面上显示时钟：</p><p id="demo"></p><button onclick="myStopFunction()">停止</button><script>var myVar=setInterval(function(){myTimer()},1000);function myTimer(){var d=new Date();var t=d.toLocaleTimeString();document.getElementById("demo").innerHTML=t;}function myStopFunction(){clearInterval(myVar);}</script></body></html>
setTimeout() 方法
setTimeout() 方法会返回某个值。在上面的语句中，值被储存在名为 myVar 的变量中。假如你希望取消这个 setTimeout()，你可以使用这个变量名来指定它。clearTimeout() 方法用于停止执行setTimeout()方法的函数代码
<!DOCTYPE html><html><head><meta charset="utf-8"><title>哎西吧</title></head><body><p>点击第一个按钮等待3秒后出现"Hello"弹框。</p><p>点击第二个按钮来阻止第一个函数运行。（你必须在3秒之前点击它）。</p><button onclick="myFunction()">点我</button><button onclick="myStopFunction()">停止弹框</button><script>var myVar;function myFunction(){myVar=setTimeout(function(){alert("Hello")},3000);}function myStopFunction(){clearTimeout(myVar);}</script></body></html>
JS 常用函数一(弹对话框 操作HTML元素 写HTML文档 写到控制台 查找元素 元素插入内容 改变HTML属性 计时)
