8. 创建一个元素节点:
1). createElement(): 按照给定的标签名创建一个新的元素节点. 方法只有一个参数:被创建的元素节点的名字, 是一个字符串.
方法的返回值:是一个指向新建节点的引用指针. 返回值是一个元素节点, 所以它的 nodeType 属性值等于 1.
**新元素节点不会自动添加到文档里, 它只是一个存在于 JavaScript 上下文的对象.
9. 创建一个文本节点:
1). createTextNode(): 创建一个包含着给定文本的新文本节点. 这个方法的返回值是一个指向新建文本节点引用指针. 它是一个文本节点, 所以它的 nodeType 属性等
于 3.
方法只有一个参数:新建文本节点所包含的文本字符串. 新元素节点不会自动添加到文档里
10. 为元素节点添加子节点:
1). appendChild(): var reference = element.appendChild(newChild): 给定子节点 newChild 将成为给定元素节点 element 的最后一个子节点.
方法的返回值是一个指向新增子节点的引用指针.
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Untitled Document</title>
<script type="text/javascript">
window.onload = function(){
//创建一个 <li>纽约</li> 节点, 并把该节点添加为 #bj 节点的最后一个子节点
//1. 创建一个 <li></li> 节点
var nyNode = document.createElement("li");
//2. 创建一个文本节点 "纽约"
var nyText = document.createTextNode("纽约");
//3. 把新创建的文本节点添加为 nyNode 节点的子节点: <li>纽约</li>
nyNode.appendChild(nyText);
//4. 把 nyNode 节点添加为 #bj 节点的最后一个子节点
document.getElementById("city").appendChild(nyNode);
};
</script>
</head>
<body>
<p>你喜欢哪个城市?</p>
<ul id="city">
<li id="bj" name="BeiJing">北京</li>
<li>上海</li>
<li>东京</li>
<li>首尔</li>
</ul>
<br><br>
<p>你喜欢哪款单机游戏?</p>
<ul id="game">
<li id="rl">红警</li>
<li>实况</li>
<li>极品飞车</li>
<li>魔兽</li>
</ul>
<br><br>
gender:
<input type="radio" name="gender" value="male"/>Male
<input type="radio" name="gender" value="female"/>Female
</body>
</html>
分享到:
相关推荐
JavaScript DOM编程艺术 --全
经典之作《javascript dom编程艺术》源码。通过一个实际案例,讲述了原生的javascript操作dom的使用方法,以及操作dom中应该注意的一些事项。
JavaScriptDOM编程艺术(第2版)PDF版本下载
第1章 JavaScript简史 1.1 JavaScript的起源 1.2 DOM 1.3 浏览器战争 1.3.1 DHTML 1.3.2 浏览器之间的冲突 1.4 制定标准 1.4.1 浏览器以外的考虑 1.4.2 浏览器战争的结局 1.4.3 崭新的起点 1.5 小结 第2章 ...
JavaScript DOM编程艺术,高清资源,无比经典,值得拥有
JavascriptDOM基本操作 dom 精品操作
本 书在简洁明快地讲述JavaScript和DOM的基本知识之后,通过几个实例演示了专业水准的网页开发技术,透彻阐述了平稳退化等一批至关重要的 JavaScript编程原则和最佳实践,并全面探讨了HTML5以及jQuery等JavaScript库...
教程名称:Javascript DOM编程视频教程(17讲) 课程目录:【】1.JavascriptDOM编程_在什么位置编写JS代码【】10.JavascriptDOM编程_删除节点【】11.JavascriptDOM编程_添加删除节点的实验...
JavaScriptDOM编程艺术第二版PDF扫描文档及各章节代码内容。
JavaScript DOM编程艺术第二版,最适合新手入门的JavaScript书籍。
本书讲述了JavaScript、DOM和HTML5的基础知识,着重介绍了DOM编程技术背后的思路和原则:平稳退化、渐进增强和以用户为中心等。这些概念对于任何前端Web开发工作都非常重要。本书将这些概念贯穿在书中的所有代码示例...
javascript_DOM,javascript_DOM,javascript_DOM,javascript_DOM
javascript dom2 源码及pdf
JavaScript DOM编程艺术 第2版.zip.002 由于上传文件大小的限制,故分成两个压缩卷,请查找对应的第一部分 学习Javascript用《JavaScript DOM编程艺术》来入门最好不过了,老老实实看两遍,看完了你就会对JS有一个...
JavaScript DOM编程艺术 经典书籍
JavaScript DOM编程艺术 第2版 及源码 JavaScript DOM编程艺术 第2版 及源码
JavaScript.DOM编程艺术(第2版)附录及源码,JavaScript.DOM编程艺术(第2版)附录及源码
JavaScriptDom编程艺术,一本很好的前端书籍,有兴趣的可以看看
第二部分“浏览器外部通信”,以Ajax和客户端—服务器端通信为主题;第三部分“部分高级脚本编程资源”,集中介绍了一批第三方脚本编程资源,包括库和API。同时,每部分的最后一章都为案例研究,将学到的内容应用于...
JavaScriptDOM编程艺术.中文版.完整书签 本书讲述了JavaScript和DOM的基础知识,但重点放在DOM编程技术背后的思路和原则:预留退路、循序渐进和以用户为中心等,这些概念对于任何前端Web开发工作都非常重要。本书...