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. accesskey附上一些实例

    HTML accesskey属性与web自定义键盘快捷访问 本文地址:http://www.zhangxinxu.com/wordpress/?p=6142 可能很多小伙伴都不知道,我们只要在HTML ...

  2. RESTFul API最佳实践

    RESTful API最佳实践 RESTful API 概述 基本概念 REST 英文全称:Representational State Transfer,直译为:表现层状态转移.首次是由Roy Th ...

  3. Android 常见内存泄露 & 解决方案

    前言 内存泄漏(Memory Leak)是指程序中己动态分配的堆内存由于某种原因程序未释放或无法释放,造成系统内存的浪费,导致程序运行速度减慢甚至系统崩溃 (OOM) 等严重后果. 那什么情况下不能被 ...

  4. JavaSE常用API

    1.Math.round(11.5)等于多少?Math.round(-11.5)又等于多少? Math.round(11.5)的返回值是12,Math.round(-11.5)的返回值是-11.四舍五 ...

  5. 部署https并自动续期

    1.其它步骤参考地址https://blog.csdn.net/achenyuan/article/details/79021340https://blog.csdn.net/Dancen/artic ...

  6. 来,我们手写一个简易版的mock.js吧(模拟fetch && Ajax请求)

    预期的mock的使用方式 首先我们从使用的角度出发,思考编码过程 M1. 通过配置文件配置url和response M2. 自动检测环境为开发环境时启动Mock.js M3. mock代码能直接覆盖g ...

  7. maven打包记录1

    在需要打包的项目目录下找到pom.xml文件 (过程中可能遇到 :-Dmaven.multiModuleProjectDirectory system property is not set. Che ...

  8. Groovy单元测试框架spock基础功能Demo

    spock是一款全能型的单元测试框架. 最近在做单元测试框架的调研和尝试,目前确定的方案框架包括是:spock,Junit,Mockito以及powermock.由于本身使用Groovy的原因,比较钟 ...

  9. 理解clientWidth,offsetWidth,clientLeft,offsetLeft,clientX,offsetX,pageX,screenX

    1. clientWidth:表示元素的内部宽度,以像素计.该属性包括内边距,但不包括垂直滚动条(如果有).边框和外边距.(clientWidth = width + padding) 2. offs ...

  10. Python文件写入时的编码问题解决

    如下代码: import sys import os import django root_dir = os.path.join(os.path.dirname(os.path.abspath(__f ...