《JavaScript DOM 编程艺术》读书笔记之JavaScript 图片库


Posted in Javascript onJanuary 09, 2015

改变图片的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

Javascript 相关文章推荐
脚本吧 - 幻宇工作室用到js,超强推荐expand.js
Dec 23 Javascript
jquery 插件 web2.0分格的分页脚本,可用于ajax无刷新分页
Dec 25 Javascript
js 学习笔记(三)
Dec 29 Javascript
基于dom编程中 动态创建与删除元素的使用
Apr 17 Javascript
轻量级网页遮罩层jQuery插件用法实例
Jul 31 Javascript
jQuery树形插件jquery.simpleTree.js用法分析
Sep 05 Javascript
[原创]JS基于FileSaver.js插件实现文件保存功能示例
Dec 08 Javascript
微信小程序 视图容器组件的详解及实例代码
Jan 19 Javascript
基于JSON数据格式详解
Aug 31 Javascript
在node环境下parse Smarty模板的使用示例代码
Nov 15 Javascript
JS实现横向轮播图(初级版)
Jun 24 Javascript
vue父子模板传值问题解决方法案例分析
Feb 26 Javascript
《JavaScript DOM 编程艺术》读书笔记之DOM基础
Jan 09 #Javascript
《JavaScript DOM 编程艺术》读书笔记之JavaScript 语法
Jan 09 #Javascript
《JavaScript DOM 编程艺术》读书笔记之JavaScript 简史
Jan 09 #Javascript
javascript获取四位数字或者字母的随机数
Jan 09 #Javascript
JS JQUERY实现滚动条自动滚到底的方法
Jan 09 #Javascript
JavaScript Math.ceil 方法(对数值向上取整)
Jan 09 #Javascript
封装好的js判断操作系统与浏览器代码分享
Jan 09 #Javascript
You might like
PHP session常见问题集锦及解决办法总结
2007/03/18 PHP
使用 MySQL Date/Time 类型
2008/03/26 PHP
Smarty最简单实现列表奇偶变色的方法
2015/07/01 PHP
Yii2创建多界面主题(Theme)的方法
2016/10/08 PHP
PHP不使用内置函数实现字符串转整型的方法示例
2017/07/03 PHP
jQuery 阴影插件代码分享
2012/01/09 Javascript
Js数组的操作push,pop,shift,unshift等方法详细介绍
2012/12/28 Javascript
点击进行复制的JS代码实例
2013/08/23 Javascript
JQuery中使用ajax传输超大数据的解决方法
2014/07/14 Javascript
JS+CSS实现下拉列表框美化效果(3款)
2015/08/15 Javascript
详解Backbone.js框架中的模型Model与其集合collection
2016/05/05 Javascript
EL表达式截取字符串的函数说明
2017/09/22 Javascript
微信小程序scroll-x失效的完美解决方法
2018/07/18 Javascript
react中实现搜索结果中关键词高亮显示
2018/07/31 Javascript
JavaScript 高性能数组去重的方法
2018/09/20 Javascript
Python生成随机MAC地址
2015/03/10 Python
关于python写入文件自动换行的问题
2018/06/23 Python
Django Rest framework之权限的实现示例
2018/12/17 Python
如何在django里上传csv文件并进行入库处理的方法
2019/01/02 Python
Python检查ping终端的方法
2019/01/26 Python
Python内置方法实现字符串的秘钥加解密(推荐)
2019/12/09 Python
Python实现播放和录制声音的功能
2020/08/12 Python
英国在线珠宝店:The Jewel Hut
2017/03/20 全球购物
联想中国官方商城:Lenovo China
2017/10/18 全球购物
世界上最大的家庭自动化公司:Smarthome
2017/12/20 全球购物
苏格兰领先的多渠道鞋店:Begg Shoes
2019/10/22 全球购物
内容编辑个人求职信
2013/12/10 职场文书
表演方阵解说词
2014/02/08 职场文书
企业总经理岗位职责
2014/02/13 职场文书
生日主持词
2014/03/20 职场文书
主题教育活动总结
2014/05/05 职场文书
2015年七一建党节活动总结
2015/03/20 职场文书
烛光里的微笑观后感
2015/06/17 职场文书
社区挂职锻炼个人工作总结
2015/10/23 职场文书
团干部培训班心得体会
2016/01/06 职场文书