innerHTML的用法

  tablerowObject.innerHTML

createTextNode的用法

  createTextNode(data)

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

区别:1)  innerHTML属于HTML Dom

      createTextNode属于XML Dom

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

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

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

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

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

innerHTML和createTextNode的区别的更多相关文章

  1. JavaScript中innerHTML与innerText,createTextNode的区别

    innerHTML和innerText 它们都会把元素内内容替换掉,区别在于: innerHTML 会把替换内容里的 HTML 标记解释执行. innerText 会把替换内容里的 HTML 标记原样 ...

  2. 【JS】JavaScript中innerHTML与innerText,createTextNode的区别

    innerHTML和innerText 它们都会把元素内内容替换掉,区别在于: innerHTML 会把替换内容里的 HTML 标记解释执行. innerText 会把替换内容里的 HTML 标记原样 ...

  3. [JS][jQuery]清空元素html("")、innerHTML="" 与 empty()的区别 、remove()区别

    清空元素html("").innerHTML="" 与 empty()的区别 一.清空元素的区别     1.错误做法一:           $(" ...

  4. innerHTML和innerText的区别,以及select元素中怎么取出被选中的option。

    一.innerHTML和innerText的区别. 元素.innerHTML = 字符串,是将一对或一个标签所标识的内容全部替换为所赋予的字符串,如果字符串中有标签,浏览器将自动识别其中的标签. 元素 ...

  5. InnerHtml() 与html( )的区别

    InnerHtml() 与html( )的区别 在一个 HTML 文档中, 我们可以使用 .html() 方法来获取任意一个元素的内容. 如果选择器匹配多于一个的元素,那么只有第一个匹配元素的 HTM ...

  6. innerHTML,outerHTML,innerText,outerText区别以及insertAdjacentHTML()方法

    在需要给文档插入大量的新的HTML标记的情况下,通过多次DOM操作先创建节点再指定它们之间的关系会非常麻烦而且效率不高,相对而言插入标记的方法会更加简单,速度也更快. 插入标记中有这四个属性inner ...

  7. 创建文本,innerHTML与createTextNode的使用

    第一种:innerHTML p.innerHTML="124"; 除了这个还可以console.log(p.innerHTML) 弹出p里面的内容; 第二种:createTextN ...

  8. innerHTML和outerHTML的区别

    一.区别:1)innerHTML: 从对象的起始位置到终止位置的全部内容,不包括Html标签.2)outerHTML: 除了包含innerHTML的全部内容外, 还包含对象标签本身. 二.例子: &l ...

  9. innerHTML和innerText的区别

    以<p id="example">welcome to <strong>JavaScript</strong> !!!</p>为例: ...

随机推荐

  1. 设置bootstrap modal模态框的宽度和宽度

    (1)修改宽度可以通过修改modal中的modal-dialog这个div宽度实现 <div class="modal-dialog" style="width:6 ...

  2. Windows提高_1.4进程通信

    进程通信 使用 WM_COPYDATA 客户端(发送端) // 1. 找到窗口程序 HWND hWnd = FindWindow(NULL, L"Window1"); ​ // 2 ...

  3. lsb_release No LSB modules are available

    lsb_release 提示: No LSB modules are available   执行: sudo apt-get install lsb-core

  4. Java必知必会的20种常用类库和API

    转载:https://blog.csdn.net/u011001084/article/details/79216958 个人感觉工具类对日常开发是很重要的,所以推荐一下这篇文章,虽然有的类库过时了 ...

  5. C#服务端通过Socket推送数据到Android端App中

    需求: 描述:实时在客户端上获取到哪些款需要补货. 要求: 后台需要使用c#,并且哪些需要补货的逻辑写在公司框架内,客户端采用PDA(即Android客户端 版本4.4) . 用户打开了补货通知页面时 ...

  6. [Python数据结构] 使用List实现Stack

    [Python数据结构] 使用List实现Stack 1. Stack 堆栈(Stack)又称为栈或堆叠,是计算机科学中一种特殊的串列形式的抽象数据类型(ADT),其特殊之处在于只能允许在阵列的一端进 ...

  7. eclipse自动换行

    Eclipse是一款非常优秀的IDE,但是不能自动换行,需要安装一个插件完成这个功能. 安装办法有两种: 1.在线安装. 选择help-->install new software,点击Add, ...

  8. reshape column vector data in Matlab

    input: import  data 2. transpose the data 3. reshape the data into array code: matlab load x.dat X=x ...

  9. Codeforces 121A Lucky Sum

    Lucky Sum Time Limit: 2000ms Memory Limit: 262144KB This problem will be judged on CodeForces. Origi ...

  10. HDU 1254 条件过程复杂的寻找最短路

    这里一看就是找箱子到终点的最短路 一开始还傻傻的以为人的位置给的很没有意思- -,然后果然错了 没过多久想明白了错误,因为你推箱子并不是你想去哪里推就能去哪推的,首先得考虑人能否过的去,因为可能人被箱 ...