关于JS中appendChild的用法
<!DOCTYPEhtml><html><body><divid="div1"><pid="p1">这是一个段落。</p><pid="p2">这是另一个段落。</p></...
<!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>
在wcschool的这段代码中，我想知道var para=document.createElement("p");和para.appendChild(node);这两句代码的意义，因为我发现我把这两句代码删除以后，将element.appendChild(para)改成element.appendChild(node)运行结果是一样的。 展开
<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>
在wcschool的这段代码中，我想知道var para=document.createElement("p");和para.appendChild(node);这两句代码的意义，因为我发现我把这两句代码删除以后，将element.appendChild(para)改成element.appendChild(node)运行结果是一样的。 展开
3个回答
展开全部
// 创建p节点
var para=document.createElement("p");
// 创建文本节点
var node=document.createTextNode("这是新段落。");
// 把文本节点添加到p节点里
para.appendChild(node);
// 查找div1
var element=document.getElementById("div1");
// 把p节点添加到div1里
element.appendChild(para);
// 最终html结构
// <div id="div1">
// <p id="p1">这是一个段落。</p>
// <p id="p2">这是另一个段落。</p>
// <p>这是新段落。</p>
// </div>
// 你测试的代码
// 创建文本节点
var node=document.createTextNode("这是新段落。");
// 查找div1
var element=document.getElementById("div1");
// 把文本节点添加到div1里
element.appendChild(node);
// 最终html结构
// <div id="div1">
// <p id="p1">这是一个段落。</p>
// <p id="p2">这是另一个段落。</p>
// 这是新段落。
// </div>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
appendChild() 方法是向节点添加最后一个子节点。
例子：
<ul id="test"><li>Coffee</li><li>Tea</li></ul>
var node=document.createElement("LI"); //创建一个li节点
var textnode=document.createTextNode("Water"); //创建一个文本节点内容
node.appendChild(textnode); //将文本节点内容，添加到li节点里面
document.getElementById("test").appendChild(node); //将li节点，添加到test几点下面
before:
Coffee
Tea
after：
Coffee
Tea
Water
例子：
<ul id="test"><li>Coffee</li><li>Tea</li></ul>
var node=document.createElement("LI"); //创建一个li节点
var textnode=document.createTextNode("Water"); //创建一个文本节点内容
node.appendChild(textnode); //将文本节点内容，添加到li节点里面
document.getElementById("test").appendChild(node); //将li节点，添加到test几点下面
before:
Coffee
Tea
after：
Coffee
Tea
Water
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
结果不一样，修改之前的结果是这样的：
<div id="div1">
<p id="p1">这是一个段落。</p>
<p id="p2">这是另一个段落。</p>
<p>这是新段落。</p>
</div>
改了之后是这样的：
<div id="div1">
<p id="p1">这是一个段落。</p>
<p id="p2">这是另一个段落。</p>
这是新段落。
</div>
虽然在页面上看起来是一样的。
<div id="div1">
<p id="p1">这是一个段落。</p>
<p id="p2">这是另一个段落。</p>
<p>这是新段落。</p>
</div>
改了之后是这样的：
<div id="div1">
<p id="p1">这是一个段落。</p>
<p id="p2">这是另一个段落。</p>
这是新段落。
</div>
虽然在页面上看起来是一样的。
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（1）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
