问答详情
源自:9-17 创建文本节点createTextNode

添加文本时createTextNode与innerHTML的差别

创建文本节点时

var textNode = document.createTextNode("lalala");

element.appendChild(textNode);

element.innerHTML = "lalala";

有什么差别?

提问者:qq_小六_3 2016-03-15 15:54

个回答

  • 红叶舞秋山1
    2017-01-11 15:17:06

    innerHTML和createTextNode都可以把一段内容添加到一个节点中,区别是如果这段内容中有html标签(如例子中的<strong></strong>)时表现就不同了,在createTextNode中会当作文本处理,不会被浏览器解析,但用innerHTML就会被当作HTML代码处理(如你的例子中Hello会被加粗显示)。
    总的来说,如果你确定要插入的内容中没有html标签,可以用innerHTML,这样更简洁,但如果不能确定(比如要插入用户输入的内容)建议用createTextNode的方式。

  • mike652638
    2016-12-03 17:22:10

    http://blog.csdn.net/yangyang_cs/article/details/39696703

    http://www.cnblogs.com/swii/p/5694818.html

    可以参考这两个博客哈, 他们是两种不同的添加节点(文本)方式.

    另外, innerHTML代码少, 过程简单, 性能比createTextNode要好, 执行更快 :)

  • lzw1
    2016-03-15 20:06:47

    正如您所写的那样,createNode是一个函数,而innerHTml是元素的一个属性。createNode创建了一个文本节点,而innerHTML是修改元素的文本值。