HTML DOM item() 方法
一直不知道javascript还有类似jQ里面eq()的函数,原来原生javascript的item()有类似功能:
由于是原生javascript,先补习下children和childNodes的区别:
1,childNodes:它是标准属性,它返回指定元素的子元素集合,包括HTML节点,所有属性,文本节点。
可以通过nodeType来判断是哪种类型的节点,只有当nodeType==1时才是元素节点,2是属性节点,3是文本节点。
2,children:非标准属性,它返回指定元素的子元素集合。
但它只返回HTML节点,甚至不返回文本节点,虽然不是标准的DOM属性,但它和innerHTML方法一样,得到了几乎所有浏览器的支持。
实例
返回元素的首个子节点:
document.body.childNodes.item(0);
测试代码:w3c地址来测试
<!DOCTYPE html>
<html>
<body>
<div id="div1">
<p class="demo">点击按钮来获得 body 元素0个子节点的名称。</p>
<p class="demo">点击按钮来获得 body 元素1个子节点的名称。</p>
<p class="demo">点击按钮来获得 body 元素2个子节点的名称。</p>
<p class="demo">点击按钮来获得 body 元素3个子节点的名称。</p>
</div>
<div id="demo"></div> <button onclick="myFunction()">试一下</button> <script>
function myFunction()
{
var x = document.getElementById("demo");
var div1 = document.getElementById("div1");
x.innerHTML = div1.childNodes.item(3).nodeName;
//x.innerHTML = div1.children.item(1).nodeName; //children得到的是元素节点
}
</script> </body>
</html>
下面来说明下item()的用法:
定义和用法
item() 方法节点列表中位于指定索引的节点。
以下两条语法产生相同的结果:
document.body.childNodes.item(0); document.body.childNodes[0];

HTML DOM item() 方法的更多相关文章
- JS1 js获取dom元素方法
js获取dom元素方法 1.通过ID选取元素(getElementById) 1)使用方法:document.getElementById("domId") 其 ...
- DOM 对象方法
DOM 对象方法 这里提供一些您将在本教程中学到的常用方法: 方法 描述 getElementById() 返回带有指定 ID 的元素. getElementsByTagName() 返回包含带有指定 ...
- HTML DOM submit() 方法
HTML DOM submit() 方法 HTML DOM Form 对象 定义和用法 submit() 方法把表单数据提交到 Web 服务器. 语法 formObject.submit() 说明 该 ...
- Vue 中 diff 算法后更新 DOM 的方法
vue 2.0加入了 virtual dom,在 node_modules\vue\src\core\vdom\patch.js 中会对虚拟 DOM 进行 diff 算法等,然后更新 DOM. 网上的 ...
- 使用DOM的方法获取所有li元素,然后使用jQuery()构造函数把它封装为jQuery对象
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- jQuery DOM 元素方法(get)
jQuery DOM 元素方法 1..get() 获得由选择器指定的 DOM 元素. $(selector).get(index)index 可选.规定获取哪个匹配元素(通过 index 编号). 实 ...
- item()方法遍历字典
Python字典的遍历方法有好几种,其中一种是for...in,这个我就不说明,在Python了几乎随处都可见for...in.下面说的这种遍历方式是item()方法. item() item()方法 ...
- HTML DOM focus() 方法
目录 HTML DOM focus() 方法 实例 定义和使用 浏览器支持 语法 参数 技术描述 更多实例 实例 实例 HTML DOM focus() 方法 实例 为 <a> 元素设置焦 ...
- python面向对象--item方法
class Foo: def __getitem__(self, item): print("getitem") return self.__dict__[item] def __ ...
随机推荐
- VS2010 的 HTML 5验证
前言 VS2010的HTML验证中,没有我们的HTML 5,网上我看到使用vs2010 sp1补丁的方法,但是我的安装不了,后来发现下面的方法,让你的vs2010具有html5的验证功能. 下载这个文 ...
- CSS学习笔记03 CSS层叠性、继承性、特殊性
层叠性 所谓层叠性是指多种CSS样式的叠加,也就是说后面设置的样式会层叠(覆盖)之前的样式,层叠性的前提是CSS的选择器的优先级相同,例如,当使用内嵌式CSS样式表定义<p>标记字号大小为 ...
- class文件打包成jar
电脑左下角“开始”——“运行”——输入cmd——cd+空格+clss文件所在文件夹的路径——jar+空格+-cf+空格+“jar包的名字”.jar+空格+*.class.好了...
- MapReduce运行原理和过程
原文 一.Map的原理和运行流程 Map的输入数据源是多种多样的,我们使用hdfs作为数据源.文件在hdfs上是以block(块,Hdfs上的存储单元)为单位进行存储的. 1.分片 我们将这一个个bl ...
- MVC Helper Methods
在.net MVC中经常会见到特别的写法 比如 @Url.Action( ) @Url.Conyent( ) @Html.Displayfor( )等等 这些 写法就是我们这里要讲的 Helper ...
- Input type=number 样式清除
/* 普通IE浏览器 样式清除 */ input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{ -webkit-appear ...
- 将textarea实现自适应高度及IE下滚动条不出现的bug
1.<el-table-column label="备注" width="180"> <template scope="scope& ...
- Dynamics 365Online 使用adal.js注册和配置SimpleSPA应用程序
本篇是基于dynamics 365online撰写,本文中使用的365online及azure均为试用版,因为online在国内还没落地,所以我申请的是新加坡版,online的申请方式可见我之前的博文 ...
- mac 安装 mysql.tar.gz
解压目录到 MySQL 默认安装路径 /usr/local/mysql 下, /usr/local路径不存在时, 先 sudo mkdir /usr/local 创建. # 移动解压后的二进制包到安装 ...
- android 解决连接电视机顶盒失败的方法
今天在开发过程中,需要连接海美迪的电视盒子,这个盒子是基于android6.0的版本,之前连接其它电视盒子都正常,当输入 adb -s xxxx shell后,盒子连接失败,日志如下: error: ...