JavaScript DOM操作案例点击按钮设置所有的p标签的内容
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title></title> 6 7 </head> 8 <body> 9 <input type="button" value="点击修改内容" id="bt"/> 10 11 <p>我是p标签</p> 12 13 <p>我是p标签</p> 14 15 <p>我是p标签</p> 16 17 <p>我是p标签</p> 18 19 <p>我是p标签</p> 20 <script> 21 //通过id获取按钮,注册点击事件,添加事件处理函数 22 document.getElementById("bt").onclick = function () { 23 //获取所有的p标签,返回值是一个数组 24 var pObj = document.getElementsByTagName("p"); 25 //遍历数组 26 for (var i = 0; i < pObj.length; i++) { 27 //修改每个p标签的内容 28 pObj[i].innerText = "这是一个p"; 29 } 30 }; 31 </script> 32 </body> 33 </html>