createTextNode()方法将创建一个包含给定文本的新文本文档节点。这个方法的返回值是一个指向新建文本节点的引用指针:

reference = document.createTextNode(text);

这个方法只返回一个参数:新建文本节点所包含的文本字符串。

reference = document.createTextNode("hello world");

createTextNode()方法所返回的引用指针指向一个几点对象,它是文本节点,所以它的nodeType属性值为3。

用createTextNode()方法创建的新文本节点不会被自动添加到文档里面,新节点没有ParentNode属性。如果想把新的文本文档节点添加到你的文档里面,需要用appendChild()或insertBefore()方法。

var message = document.createTextNode("hello word");
var container = document.getElementById("intro");
container.appendChild(message);

这个例子将创建一个包含文本“hello world”的文本节点,并把这个文本节点追加到id值等于“intro”那个元素。

createTextNode()经常与createElement()方法配合使用。用下面语句将创建一段HTML内容,并且插入文档中

var message = document.createTextNode("hello world");
var container = document.createElement("p");
container.appendChild(message);
document.body.appendChild(container);

在这个例子中,第一条语句创建包含文本“hello world”的文本节点,并把由createTextNode()方法返回的引用指针赋值给变量message,第二条语句常见p元素,并且赋值给变量container,第三条使用appendChild()方法把message文本节点添加插入container元素节点上,第四条语句把刷新后的container元素追加给文档的bbody元素。

createTextNode的更多相关文章

  1. 【前端积累】createElement createTextNode

    <!DOCTYPE html> <html><!--树根--> <head> <meta charset="utf-8"> ...

  2. createElement,createTextNode,appendChild

    <html> <head> <meta charset="UTF-8"> <title></title> <scr ...

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

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

  4. createElement、createTextNode、setAttribute使用方法

    createElement() 方法可创建元素节点. 示例:var placeholder = document.createElement("img"); createTextN ...

  5. 创建文本节点createTextNode

    <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content ...

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

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

  7. JavaScript--Document对象方法createElement()和createTextNode()

    createElement() 方法通过指定名称创建一个元素 createTextNode() 可创建文本节点 <!DOCTYPE html> <html> <head& ...

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

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

  9. js createElement appendChild createTextNode用法

    xml不支持innerHTML 1 <p id="bj">北京</p> <script type="text/javascript" ...

  10. createTextNode和innerHTML什么区别

    今天写代码,用到createTextNode,发现好像功能和innerHTML是一样的,于是查阅了网上的资料了. 一.createTextNode 例如: var element = document ...

随机推荐

  1. Java 读取properties 配置文件的几种方式

    基于ClassLoder读取配置文件 Properties properties = new Properties(); // 使用ClassLoader加载properties配置文件生成对应的输入 ...

  2. ES6对象简洁语法

    对象(object)是 JavaScript 最重要的数据结构.ES6 对它进行了重大升级,本章介绍数据结构本身的改变及语法应用细节. 1.属性的简洁表示法 ◆ ES6 允许直接写入变量和函数,作为对 ...

  3. 使用Windows Powershell卸载和安装Win10 原生应用的方法

    新装的Win10带有大量的实际工作和生活中不怎么常用的APP,如果觉得这些APP占用磁盘空间或者想要卸载这些应用(APP),Win10下并不能使用Windows 应用管理器直接图形化地卸载这些应用,而 ...

  4. windows vscode 远程调试代码

    需要: vscode + Remote-ssh(vscode插件中下载) openssh (https://www.mls-software.com/files/setupssh-8.0p1-2.ex ...

  5. deepin扬声器/耳机没有声音解决方案

    昨天准备在deepin系统下看视频学习一下Linux,结果登入deepin系统后发现不论是外放还是插耳机竟然都没有声音,这种情况以前也出现过,只不过没有在意,后来就自己又好了,今天这次可真是让我决定要 ...

  6. AD中如何插入logo(图片)

    图片转成protel altium AD PCB封装 LOGO方法 1. 2. 3. 4.打开下列顺序文件夹 Examples-->Scripts-->Delphiscript Scrip ...

  7. Spring Boot实战之定制type Formatters

    本文首发于个人网站:Spring Boot实战之定制type Formatters 前面我们有篇文章介绍了PropertyEditors,是用来将文本类型转换成指定的Java类型,不过,考虑到Prop ...

  8. 入门Android底层需要的一些技能

    <Android的设计与实现> Android框架层<Linux系统编程手册> Linux系统编程<Android内核剖析> 编译框架和romC语言和Linux内核 ...

  9. DZY Loves Math II:多重背包dp+组合数

    Description Input 第一行,两个正整数 S 和 q,q 表示询问数量.接下来 q 行,每行一个正整数 n. Output 输出共 q 行,分别为每个询问的答案. Sample Inpu ...

  10. P3521 [POI2011]ROT-Tree Rotations(线段树合并)

    一句话题意(不用我改了.....):给一棵n(1≤n≤200000个叶子的二叉树,可以交换每个点的左右子树,要求前序遍历叶子的逆序对最少. ......这题输入很神烦呐... 给你一棵二叉树的dfs序 ...