js dom 操作实例图解

以下操作的是www.ibm.com；

下面是在js调试控制台中操作；

根据id和name获取元素对象；获取对象后获取值用getAttribute；

遍历一个元素的属性集合，输出属性的名字和值；

遍历一个元素的子节点，输出子节点的id，name;

遍历一个元素的子节点，输出其id，和子节点类型；子节点类型没获取到；

获取元素q的类型，是文本框；

获取元素ibm-top的类型，结果是null；ibm-top是一个div；

qq-sendUrl-btn也是一个div；

根据类名获取元素；

如果取到多个，以逗号隔开；

获取元素的第一个子节点；

获取元素的父节点；

document.getElementById("q");
document.getElementById("q").getAttribute("maxlength");document.getElementById("q").getAttribute("value");document.getElementById("q").getAttribute("aria-owns");for (i=0; i<document.getElementById("q").attributes.length; i++){console.log(document.getElementById("q").attributes[i].name,"，",document.getElementById("q").attributes[i].value);
}for(i=0;i<document.body.childNodes.length;i++){console.log(document.body.childNodes[i].id,", ",document.body.childNodes[i].name);
}

js dom 操作实例图解相关推荐

js dom操作实现雪花下落
关于使用dom操作完成雪花下落的实现关于实现雪花下落的实现实现代码段如下 <!DOCTYPE html> <html lang="en"> <he ...
JS DOM 操作实现代码
简单的表格: 复制代码代码如下: <table> <tr> <td id="TEST"> <input type="submi ...
java冒泡函数解释,JS DOM操作函数事件阻止事件冒泡
一函数 1.字符串函数 s.tolowerCase( ): -- 变小写 s.toupperCase( ): -- 变大写 s.substr( 2 , 8 ): -- 截取 ...
js DOM操作元素样式
element.style 行内样式操作 element.className 类名样式操作 1. element.style 上下文是获取到的元素: 通过element.style.某个css样式设 ...
前端案例：像素鸟小游戏（js+dom操作，完整代码，附案例素材）
目录一.案例效果二.实现思路三.完整代码+详细注释四.案例素材一.案例效果二.实现思路创建游戏背景板和小鸟,并分别设置相对定位与绝对定位: 初始化背景图的位置: 初始化小鸟的位置: 设置 ...
JS DOM操作基础
1.创建节点 //(1).创建元素节点 var ele1 = document.createElement("div"); //(2).创建文本节点 var text1 = doc ...
js DOM操作自定义属性
自定义属性:在日常开发中,html的内置属性已经无法满足程序员的日常开发,所以需要我们自己定义属性,H5给我们新增了自定义属性,为了防止自定义属性和内置属性引起歧义,所以H5规定自定义属性以data- ...
MV* 框架与 DOM操作为主 JS库的案例对比
最近分别使用 Zepto 和 Avalon框架写了个 SPA项目,贴出来讨论下 JS DOM操作为主 JS库与 MV* 框架的对比案例(MV* 框架与 DOM操作 JS库实例对比) 购物车页面 ...
使用JavaScript下进行iframe的DOM操作（考虑浏览器兼容性）
今天碰到一个浏览器兼容性的问题,是IE和Firefox下iframe DOM操作的差异.本文借IE和Firefox在iframe DOM操作的不同,进行分析说明JavaScript在DOM操作中两者的 ...

js dom 操作实例图解

js dom 操作实例图解相关推荐

最新文章

热门文章