JavaScript基础1——在末尾添加节点

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="UTF-8">
 5         <title>在末尾添加节点</title>
 6     </head>
 7     <body>
 8         <ul>
 9             <li>111</li>
10             <li>222</li>
11             <li>333</li>
12             <li>444</li>
13         </ul>
14         <br>
15         <input type="button" value="添加节点" onclick="addNode()" />
16         <script type="text/javascript">
17             function addNode() {
18                 // 获取到ul
19                 var ul = document.getElementsByTagName("ul")[0];
20                 // 创建li
21                 var li = document.createElement("li");
22                 // 创建文本
23                 var length = ul.children.length + 1;
24                 var text = document.createTextNode(length + "" + length + "" + length);
25                 // 在li中加入文本
26                 li.appendChild(text);
27                 // 在ul中加入li
28                 ul.appendChild(li);
29             }
30         </script>
31     </body>
32 </html>

 

转载于:https://www.cnblogs.com/linyisme/p/5864946.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值