自学javascript笔记_自用_解析W3school的代码_创建删除节点

<!DOCTYPE html>
<html>
<body>

<div id="div1">
<p id="p1">这是一个段落。</p>
<p id="p2">这是另一个段落。</p>
</div>

<script>
var para=document.createElement("p");
var node=document.createTextNode("这是新段落。");
para.appendChild(node);

var element=document.getElementById("div1");
element.appendChild(para);
</script>

</body>
</html>

这里是用html dom添加一句话。这首先需要创建html元素。

document.createElement(''p'');就是创建了一个<P>元素;

下面一句是创建了一个文本节点。第三句就是把这个文本节点放在了<P>元素里了,就是para="<P>这是新段落</p>";

最后是把这个para放在了div元素里了。这就完成了。

即是在已有的元素里面追加了一个元素又在元素中加了一个文本节点。已有的元素叫做父亲元素

(必须是在已有的元素里添加啊?)

那么删除html元素的话,就是找到父亲元素和要删除的元素,用父亲元素删除其中的孩子元素。代码是下面的:

<!DOCTYPE html>
<html>
<body>

<div id="div1">
<p id="p1">这是一个段落。</p>
<p id="p2">这是另一个段落。</p>
</div>

<script>
var parent=document.getElementById("div1");
var child=document.getElementById("p1");
parent.removeChild(child);
</script>

</body>
</html>

appendchild()和removechild()函数都是父亲元素的方法。


这是W3里的提示:如果能够在不引用父元素的情况下删除某个元素,就太好了。不过很遗憾。DOM 需要清楚您需要删除的元素,以及它的父元素。





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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值