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, ...
随机推荐
- Google one联合联发科,国内低端智能机方案怎么办?
欢迎转载opendevkit文章, 文章原始地址: http://www.opendevkit.com/?e=46 Google在Google I/O大会, 发布的Android One,由于看重的是 ...
- ehcache基本使用
maven <dependency> <groupId>net.sf.ehcache</groupId> <artifactId>ehcache< ...
- 我的前端架构之二--统一扩展Js方法
我的前端架构汇总 MyJs_Core.js 这是一个核心的Js文件,它扩展了原生的Js方法.如下: Array对象: 1) indexOf 2) max 3) min 4) removeAt 5) i ...
- 【腾讯Bugly干货分享】微信终端跨平台组件 mars 系列(一) - 高性能日志模块xlog
本文来自于腾讯bugly开发者社区,非经作者同意,请勿转载,原文地址:http://dev.qq.com/topic/57ff5932cde42f1f03de29b1 本文来源: 微信客户端开发团队 ...
- Host is not allowed to connect to this MySQL server 错误的处理方法
1. mysql>use mysql; mysql>update user set host = '%' where user = 'root'; mysql>select host ...
- .NET面试基础知识
1. 什么是Asp.Net? 答:Asp.Net是一种基于.NET平台下的动态web开发技术,它使用的是codebehind(代码后置技术),可以将前台呈现和后台代码进行有效的分离. 2. ...
- Asp.net MVC 中Ajax的使用 [分享]
文章转自 http://www.huiyoumi.wang/upload/forum.php?mod=viewthread&tid=75&extra= Asp.net MVC 抛弃了A ...
- swift tableview的分割线不能到头
1,设置tableview的separatorInset, layoutMargins if(myTableView.respondsToSelector("setSeparatorInse ...
- Vue.js2.0从入门到放弃---入门实例
最近,vue.js越来越火.在这样的大浪潮下,我也开始进入vue的学习行列中,在网上也搜了很多教程,按着教程来做,也总会出现这样那样的问题(坑啊,由于网上那些教程都是Vue.js 1.x版本的,现在用 ...
- Java程序员的日常 —— 多进程开发IO阻塞问题
本篇仍旧是源于最近的工作,总结一下纪念那些年埋下的坑... 背景故事 需求:"使用进程方式启动另一个程序!" 开发:"OK! Runtime.getRuntime().e ...