javascript学习总结(二):DOM常用方法。
1 获取元素节点
a document.getElementById(id),它返回一个对象。是Document对象特有的函数,它还有这些方法:
b element.getElementsByTagName(tagname)或document.getElementsByTagName(tagname),它返回一个对象数组
c HTML5 Dom中的新方法:document.getElementsByClassName(className)它返回一个对象数组
若浏览器不支持此方法,则自己写一个:
function getElementsByClassName(node, classname) {
if (node.getElementsByClassName) {
return node.getElementsByClassName(classname);
} else {
var results = new Array();
var elems = document.getElementsByTagName("*");
for (var i=0; i<elems.length; i++) {
if (elem[i].className.indexOf(classname) !=-1)
results[results.length] = elems[i];
}
}
return results;
}
2 获取和设置属性
a object.getAttribute(attribute),它不属于document对象,只能通过元素节点调用
b object.setAttribute(attribute,value);同样只能通过元素节点调用
3 事件处理函数
4 HTML DOM Element 对象的常用属性和方法
element.childNodes 返回元素子节点的列表。
element.firstChild 返回元素的首个子节点。
element.lastChild 返回元素的最后一个子节点。
element.nextSibling 返回位于相同节点树层级的下一个节点(兄弟节点)。
element.nodeValue 设置或返回元素值。
element.parentNode 返回元素的父节点。
element.removeChild() 从元素中移除子节点。
element.replaceChild() 替换元素中的子节点。
nodelist.length 返回 NodeList 中的节点数。
参考:
http://www.w3school.com.cn/
JavaScripts DOM编程艺术 第2版
javascript学习总结(二):DOM常用方法。的更多相关文章
- JavaScript学习记录二
title: JavaScript学习记录二 toc: true date: 2018-09-13 10:14:53 --<JavaScript高级程序设计(第2版)>学习笔记 要多查阅M ...
- Javascript学习笔记二——操作DOM
Javascript学习笔记 DOM操作: 一.GetElementById() ID在HTML是唯一的,getElementById()可以定位唯一的一个DOM节点 二.querySelector( ...
- javascript学习(二) DOM操作HTML
一:DOM操作HTML JavaScript能够改变页面中所有的HTML元素 JavaScript能够改变页面中所有的HTML属性 JavaScript能够改变页面中所有的CSS样式 JavaScri ...
- javascript学习 真正理解DOM脚本编程技术背后的思路和原则
本文学习来源于<javascriptDOM编程艺术>仅作笔记 学会怎样才能利用DOM脚本编程技术以一种既方便自己更体贴用户的方式去充实和完善你们的网页. 循序渐进:从最核心的内容开始,逐步 ...
- javascript学习笔记之DOM与表单
DOM(文档对象模型),猫叔了一个层次化的节点树 一.DOM NODE相关公共属性与方法 DOM中所有节点都实现了NODE接口,该接口的公共属性和方法如下: 1.节点基本属性 1)NodeType 节 ...
- javascript学习笔记二
1.js的string对象 **创建 String对象 *** var str = "abc"; **方法 和 属性(文档) *** 属性 length : 字符串的长度 ***方 ...
- JavaScript学习总结(二十三)——JavaScript 内存泄漏教程
参考教程:http://www.ruanyifeng.com/blog/2017/04/memory-leak.html 一.什么是内存泄漏? 程序的运行需要内存.只要程序提出要求,操作系统或者运行时 ...
- javascript学习笔记之DOM
DOM(文档对象模型),描述了一个层次化的节点树 一.DOM NODE相关公共属性与方法 DOM中所有节点都实现了NODE接口,该接口的公共属性和方法如下: 1.节点基本属性 1)NodeType 节 ...
- JavaScript学习笔记(二)——闭包、IIFE、apply、函数与对象
一.闭包(Closure) 1.1.闭包相关的问题 请在页面中放10个div,每个div中放入字母a-j,当点击每一个div时显示索引号,如第1个div显示0,第10个显示9:方法:找到所有的div, ...
- JavaScript学习总结(二)——闭包、IIFE、apply、函数与对象
一.闭包(Closure) 1.1.闭包相关的问题 请在页面中放10个div,每个div中放入字母a-j,当点击每一个div时显示索引号,如第1个div显示0,第10个显示9:方法:找到所有的div, ...
随机推荐
- iOS开发--Block
iOS开发--Block 1.什么是Block,block 的作用 ui开发和网络常见功能实现回调,按钮的事件处理方法是回调方法以及网络下载后的回调处理 (1)按钮 target-action 一 ...
- 如何让ECSHOP不同的分类调用不同模板方法
如何给ecshop商品分类,显示不同的模板的话.可以通过不同的分类ID来取得不同模板.我们可以通过分类ID来判断,比如分类为1的,调用cat1.dwt.分类为2的,调用cat2.dwt,我们在cate ...
- I/O优化篇
转载:http://blog.csdn.net/gzh0222/article/details/9227393 很不错 1.系统学习 IO性能对于一个系统的影响是至关重要的.一个系统经过多项优化以后, ...
- Replication的犄角旮旯(二)--寻找订阅端丢失的记录
<Replication的犄角旮旯>系列导读 Replication的犄角旮旯(一)--变更订阅端表名的应用场景 Replication的犄角旮旯(二)--寻找订阅端丢失的记录 Repli ...
- springrain 1.1 发布,spring 的极简封装
经过2个月的测试修改,springrain1.1已经稳定,今日发布. 主要改动如下: 1.添加批量更新和保存的方法 2.添加maven分支 3.添加博客管理的demo 4.增加redis做为缓存实现 ...
- Java设计模式10:观察者模式
观察者模式 观察者模式也叫作发布-订阅模式,也就是事件监听机制.观察者模式定义了一种一对多的依赖关系,让多个观察者对象同时监听某一个主题对象,这个主题对象在状态上发生变化时,会通知所有观察者对象,使他 ...
- C语言#自动生成四则运算的编程
#include <iostream> #include <stdio.h> #include <stdlib.h> #include <time.h> ...
- JavaScript思维导图—函数基础
JavaScript思维导图-来自@王子墨http://julying.com/blog/the-features-of-javascript-language-summary-maps/
- ehcache2拾遗之write和load
问题描述 在cache系统中writeThrough和writeBehind是两个常用的模式. writeThrough是指,当用户更新缓存时,自动将值写入到数据源. writeBehind是指,在用 ...
- 关于基本类型值和引用类型值以及Vue官方API的array.$remove(reference)
今天又是孟哥解惑. 数组里的元素也是指向内存地址么? 这个要分情况的. 无论a[0],a[2]在什么地方,只要其值是基本类型值,就是值的比较,只要其值是引用类型(对象),就是内存地址的比较. Vue官 ...