JavaScript DOM 编程艺术(第2版)读书笔记(4)
案例研究:JavaScript 图片库
改变图片的src属性的两种方式:
1,setAttribute方法是“第1级DOM”的组成部分,它可以设置元素节点的任意属性。
2,element.src = source;这是在“第1级DOM”出现之前的方法,现在也有效。
“第1级DOM”的优势是可移植性好,那些老方法只适用于Web文档,DOM则适用于任何一种标记语言。
事件处理函数
当点击某个链接时,我希望留在这个网页面而不是转到另一个窗口,代码如下:
<a href="http://www.example.com" onclick="showPic(this); return false ;">Click</a>
当点击这个链接时,因为onclick事件处理函数所触发的Javascript代码返回的值是false,所以这个链接的默认行为没有被触发.
childNodes属性
childNodes属性可以用来获取任何一个元素的所有子元素。由childNodes属性返回的数组包含所有类型的节点,而不仅仅是元素节点。事实上,文档里几乎每一样东西都是一个节点,甚至连空格和换行符都会被解释为节点,而它们全都包含在childNodes属性所返回的数组中。
但每个节点都有nodeType属性。nodeType属性总共有12种可取值,但其中仅有3种具有使用价值:元素节点的nodeType属性值是1,属性节点的nodeType属性值是2,文本节点的nodeType属性值是3.
如果想改变一个文本节点的值,那么就用DOM提供的nodeValue属性。
数组元素childNodes[0]有个更直观易读的同义词,可以把它写成firstChild;DOM还提供了一个与之对应的lastChild属性。
示例:
<p id="description">Choose an image</p>
首先创建一个变量来存放它:
var description = document.getElementById("description");
description.nodeValue的返回值是null。<p>元素本身的nodeValue属性是一个空值,而如果想要得到<p>元素包含的文本的值,要用description.childNodes[0].nodeValue或者description.firstChild.nodeValue
<!--
作者:纤锐
出处:http://www.cnblogs.com/beginner2014/p/4152647.html
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接。谢谢合作。
-->
JavaScript DOM 编程艺术(第2版)读书笔记(4)的更多相关文章
- Javascript DOM 编程艺术(第二版)读书笔记——基本语法
Javascript DOM 编程艺术(第二版),英Jeremy Keith.加Jeffrey Sambells著,杨涛.王建桥等译,人民邮电出版社. 学到这的时候,我发现一个问题:学习过程中,相当一 ...
- 读书笔记:JavaScript DOM 编程艺术(第二版)
读完还是能学到很多的基础知识,这里记录下,方便回顾与及时查阅. 内容也有自己的一些补充. JavaScript DOM 编程艺术(第二版) 1.JavaScript简史 JavaScript由Nets ...
- 《JavaScript DOM编程艺术(第二版)》读书总结
这本书是一本很基础的书,但对于刚入前端不久的我来说是一本不错的书,收获还是很大的,对一些基础的东西理解得更加透彻了. 1.DOM即document object model的缩写,文档对象模型,Jav ...
- 【读书笔记】读《JavaScript DOM 编程艺术-第2版》
1.DHTML DHTML曾被认为是HTML/XHTML.CSS和JavaScript相结合的产物,就像今天的HTML5那样,但把这些东西真正凝聚在一起的是DOM.如果真的需要来描述这一过程的话,“D ...
- Javascript DOM 编程艺术(第二版)读书笔记——DOM基础
1.DOM是什么 D=document(文档) O=object(对象) M=Model(模型) DOM又称节点树 一些术语: parent(父) child(子) sibling(兄弟) ...
- JavaScript -- JavaScript DOM 编程艺术(第2版)
/* 渐进增强 平稳退化 网页 结构层(structural layer): HTML 表示层(presentation layer): CSS <link rel="styleshe ...
- 《JavaScript DOM 编程艺术 第 2 版》
第 5 章 最佳实践 平稳退化:现在基本所有带交互的网站都使用 Ajax,SAP 也火起来了,平稳退化真是很难实现了(看到第七章发现我之前的观点是错了) 分离 JS 向下兼容 性能考虑 第 6 章 案 ...
- JavaScript DOM编程艺术读后感(1)—— 平稳退化
最近,在读<JavaScript DOM编程艺术(第二版)>这本书,想着将自己的读后感记录下来,作为记忆吧. 其实我并不是最近才刚开始读这本书的,我读了有一段时间了.我是一名web前端开发 ...
- JavaScript DOM编程艺术(第2版)的简单总结
介绍 JavaScript DOM编程艺术(第2版)主要讲述了 JavaScript.DOM 和 HTML5 的基础知识,着重讲述了 DOM 编程,并通过几个实例演示了具有专业水准的网页开发. 下面介 ...
- 《JavaScript Dom 编程艺术》读书笔记-第4章
我的前端入门第一本书是<JavaScript Dom 编程艺术>,网上查找资料发现前端的入门推荐书籍最受好评的就是这本和<JavaScript 高级程序设计>了.之所以先选这本 ...
随机推荐
- Spring Security HTTP Basic for RESTFul and FormLogin (Cookies) for web - Annotations
@Configuration @EnableWebMvcSecurity @EnableGlobalMethodSecurity(securedEnabled = true, prePostEnabl ...
- jquery文字溢出处理,超出变省略号
//文字溢出 $(function(){ $(".d_dt a").each(function(){ var maxwidth =100; if($(this).text().le ...
- MySQL内存使用分析
转自: http://www.jb51.net/article/38936.htm 本篇文章是对MySQL内存的使用说明(全局缓存+线程缓存)进行了详细的分析介绍,需要的朋友参考下 首先我们来看 ...
- BeanUtils设置字段值失败问题
package org.apache.commons.beanutils; import static org.junit.Assert.*; import java.beans.BeanInfo; ...
- PostgreSQL Replication之第十章 配置Slony(6)
10.6 执行故障切换 一旦您学会了如何复制表并将它们添加到集合中,是时候学习故障转移了.基本上,我们可以在两个两种类型的故障转移之间做出区分: • 计划内故障转移 • 计划外故障转移和崩溃 在本节, ...
- G面经prepare: Chucked Palindrome
给定一个字符串,找出最多有多少个chunked palindrome, 正常的palindrome是abccba, chunked palindrome的定义是:比如volvo, 可以把vo划分在一起 ...
- eclipse jsp 加载服务器tomcat
1.window->Preferences
- C++之路进阶——bzoj1030(文本生成器)
F.A.Qs Home Discuss ProblemSet Status Ranklist Contest ModifyUser hyxzc Logout 捐赠本站 Notice:由于本OJ建立在 ...
- SpringMvc的数据绑定流程
在SpringMvc中会将来自web页面的请求和响应数据与controller中对应的处理方法的入参进行绑定,即数据绑定.流程如下: -1.SpringMvc主框架将ServletRequest对象及 ...
- jquery on 动态添加的元素,神奇的bug
$(document.body).on("click", ".comments-item .link-comment", function () { 平时用 d ...