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>

 

posted @ 2018-07-19 20:26  {颜逸}  阅读(1142)  评论(0编辑  收藏  举报