                        课程
                    
                        /前端开发
                        
                            /JavaScript
                        
                        /JavaScript进阶篇

例子为什么要创建一个文本节点追加到newdone这个节点中？

function replaceMessage() {

var newnode=document.createElement("p");

var newnodeText=document.createElement("JS");

// newnode.innerHTML="JS"; 这样不是更简单吗

var oldNode = document.getElementById('oldnode');

oldNode.parentNode.replaceChild(newnode,oldnode);

}

</script>

直接用innerHTML不是更简单吗？还有按照之前的课程讲的（就是讲子节点childNodes那节），计算总元素节点是7个的那个例子。这边如果把文本节点追加到元素节点中，那么在计算子节点的时候，是不是在元素节点里面还要算上文本节点？那7个子节点就不对了

帅弟弟

2017-02-08

源自：JavaScript进阶篇 9-15

关注问题我要回答

1144

操作

收起

4 回答

呜哩哇啦boy 回答被采纳 +3 积分
2017-02-09

一开始我也很疑惑，看了一下这篇博客就明白了：http://www.cnblogs.com/swii/p/5694818.html

两者的区别在于，innerHTML会将文本中包含的HTML代码实现效果，而createTextNode只是纯粹创造了文本节点，所以返回的效果也就是纯文本内容。

希望能帮助到你

5 回复有任何疑惑可以回复我~

收起回答

帅弟弟提问者

谢谢里面总结很到位

2017-02-10 回复有任何疑惑可以回复我~

帅弟弟提问者
2017-02-10

nnerHTML的用法

　　tablerowObject.innerHTML

createTextNode的用法

　　createTextNode(data)

　　返回新创建的 Text 节点，表示指定的 data 字符串。

区别：1)　　innerHTML属于HTML Dom

　　　　　　createTextNode属于XML Dom

　　　2)　　虽然效果类似但是在某种情况下是有区别的

1 var p=document.createElement("p");2 p.className="message";3 p.innerHTML="<b>I love js</b>";4 document.body.appendChild(p);
1 var p=document.createElement("p");2 p.className="message";
3 var textnode=document.createTextNode("<b>I love js</b>");4 p.appendChild(textnode);5 document.body.appendChild(p);

在第一种情况下呈现出的效果是加粗的文本内容

而在第二种情况下呈现出的效果是<b>I love js</b>原文本。

所以两者的区别在于，innerHTML会将文本中包含的HTML代码实现效果，而createTextNode只是纯粹创造了文本节点，所以返回的效果也就是纯文本内容。

-----转

0 回复有任何疑惑可以回复我~

收起回答