Javascript-DOM笔记
参考
JavaScript原生的dom操作方法
第一类:节点查找相关方法和属性
document/父节点.getElementById()
document/父节点.getElementsByTagName()
document/父节点.getElementsByName() //IE8以下不兼容
称作:dom0级方法
.获取元素的属性(常用) getAttribute()
.设置元素的属性(常用) setAttribute()
其它,dom扩展中还提供了以下方法:
querySelector()
querySelectorAll()
matchesSelector()
上述方法接收一个css选择符对
考虑空白符的相关层次关系属性
.访问子节点的属性 .childNodes;//注意,由于兼容性问题,有所谓"空白项"问题
var childnode = document.getElementsByTagName("ul")[0].childNodes;
.访问父节点 parentNode
JavaScript dom对象常用属性
. innerHtml dom对象.innerHtml
. nodeType
. nodeName
. offsetWidth offsetHeight
.scorllHeight
document.documentElement.offsetWidth || document.body.offsetWidth;
document.documentElement.offsetHeight;
第二类:动态操作节点相关方法
.创建元素节点 createElement() 或 document.createElement()
.创建文本节点 createTextNode()
.添加子节点:父元素.appendChild()
.插入新节点: 父元素.insertBefore(newNode,relNode)
.替换节点:父元素.replaceChild(newNode,oldNode)
.删除节点:父元素.removeChild(node)
.克隆节点:节点.cloneNode() 传入true参数代表深度克隆,否则为浅克隆
Javascript-DOM笔记的更多相关文章
- javascript DOM 笔记
以下内容来自<javasript DOM 编程艺术>第二版 dom中三种重要的节点:元素节点.属性节点.文本节点. 几种节点的重要属性:nodeValue,nodeType(为数字1.2. ...
- DOM笔记(十):JavaScript正则表达式
一.RegExp ECMAScript通过RegExp类型类支持正则表达式,语法和Perl类似: var exp = /pattern/flags; patternb部分是任何简单的或复杂的正则表达式 ...
- DOM笔记(五):JavaScript的常见事件和Ajax小结
一.常见事件类型 1.鼠标事件 事件名称 说明 onclick 鼠标单击时触发 ondbclick 鼠标双击时触发 onmousedown 鼠标左键按下时触发 onmouseup 鼠标释放时触发 on ...
- 《javascript dom编程艺术》笔记(一)——优雅降级、向后兼容、多个函数绑定onload函数
刚刚开始自学前端,如果不对请指正:欢迎各位技术大牛指点. 开始学习<javascript dom编程艺术>,整理一下学习到的知识.今天刚刚看到第六章,记下get到的几个知识点. 优雅降级 ...
- DOM笔记(十):JavaScript正則表達式
一.RegExp ECMAScript通过RegExp类型类支持正則表達式,语法和Perl类似: var exp = /pattern/flags; patternb部分是不论什么简单的或复杂的正則表 ...
- DOM笔记(十三):JavaScript的继承方式
在Java.C++.C#等OO语言中,都支持两种继承方式:接口继承和实现继承.接口继承制继承方法签名,实现继承则继承实际的方法和属性.在SCMAScript中,由于函数没有签名,所以无法实现接口继承, ...
- Javascript DOM 编程艺术(第二版)读书笔记——基本语法
Javascript DOM 编程艺术(第二版),英Jeremy Keith.加Jeffrey Sambells著,杨涛.王建桥等译,人民邮电出版社. 学到这的时候,我发现一个问题:学习过程中,相当一 ...
- javascript高级笔记——内含事件,DOM,BOM等
JavaScript高级笔记 1,DOM的简单学习 1.1,功能:用于控制HTML文档的内容: 1.2,获取页面标签对象:Element *document.getElementById(" ...
- 《JavaScript DOM 编程艺术》 学习笔记
目录 <JavaScript DOM 编程艺术> 学习笔记 第一章 js简史 第二章 js语法 准备工作 语法 第三章 DOM DOM中的D DOM中的O DOM中的M 第四章 js图片库 ...
- Javascript学习笔记三——操作DOM(二)
Javascript学习笔记 在我的上一个博客讲了对于DOM的基本操作内容,这篇继续巩固一下对于DOM的更新,插入和删除的操作. 对于HTML解析的DOM树来说,我们肯定会时不时对其进行一些更改,在原 ...
随机推荐
- FS系统开发设计(思维导图)
FS系统开发设计(思维导图) 最近做了一个小系统,公司应急,要对各个部门进行费用成本核算分摊,做运维,苦于无奈,简简单单的设计了一下,模仿用友ERP软件,首先对DB进行了初步设计,总体如下: 未完 ...
- linux kernel menuconfig【转载】
原文网址:http://www.cnblogs.com/kulin/archive/2013/01/04/linux-core.html Linux内核裁减 (1)安装新内核: i)将新内核copy到 ...
- ORA-28547:connection to server failed, probable Oracle Net admin error错误,解决方法
当用navicat连接oralce数据库时报ORA-28547错误时,直接懵逼了,上网查了资料说是navicat自带的oci.dll文件的版本和服务器端的oralce数据库的版本不一致造成的. 修改O ...
- 引用com.sencha.gxt.ui.GXT加载错误解决方案
环境GWT2.7+GXT4.0 <inherits name='com.sencha.gxt.ui.GXT' /> 出现加载错误 Loading inherited module 'com ...
- C语言第二次实验作业
PTA ================= 11-6 方阵循环右移 --------------- 本题要求编写程序,将给定n×n方阵中的每个元素循环向右移m个位置,即将第0.1.....n-1列变换 ...
- QQ控件时光轴特效总结
1.插入HTML数据 插入html代码,一般的做法是通过document.getElementById("").innerHTML来实现. 然而在该控件中,它通过JS replac ...
- __cdecl & __stdcall calling conventions
(一) __cdecl: c declaration C语言默认的函数调用方法:所有参数从右到左依次入栈,这些参数由调用者清除,称为手动清栈.C/C++默认的调用方式,可用于函数参数不确定的情况下. ...
- SpringMVC—对Ajax的处理(含 JSON 类型)(3)
五.服务器端的 SpringMVC 如何返回 JSON 类型的字符串. 请求: $("#testJson8").click(function () { $.ajax({ ...
- DAY17-Django之model查询
查询表记录 看专业的官网文档,做专业的程序员! 查询相关API <1> all(): 查询所有结果——QuerySet <2> filter(**kwargs): 它包含了与所 ...
- DAY15-web框架本质及第一个Django实例
Web框架本质 我们可以这样理解:所有的Web应用本质上就是一个socket服务端,而用户的浏览器就是一个socket客户端. 这样我们就可以自己实现Web框架了. 半成品自定义web框架 impor ...