zoukankan      html  css  js  c++  java
  • createTextNode和innerHTML什么区别

    今天写代码,用到createTextNode,发现好像功能和innerHTML是一样的,于是查阅了网上的资料了。

    一、createTextNode 例如:

    var element = document.createElement("div");
    element.className = "message";
    var textNode = document.createTextNode("<Strong>Hello</Strong>");
    element.appendChild(textNode);
    document.body.appendChild(element);

    结果: <Strong>Hello</Strong>

    二、innerHTML 例子:

    <div > <h2 id="h2"></h2></div>
    document.getElementById("h2").innerHTML = "<strong>hello</strong>";

    结果: Hello 识别成加粗的黑体

    三、区别

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

  • 相关阅读:
    用Total Commander for Android管理应用程序
    我的zsh简单设置
    C# Newtonsoft.Json 使用
    Wireshark 抓包 test
    C# 调用API test
    C# 委托 的语法 之一
    C# 对象初始化器 和数组初始化语法
    C 语言 数据类型长度
    vue 使用 test
    test
  • 原文地址:https://www.cnblogs.com/xtdxs/p/6570608.html
Copyright © 2011-2022 走看看