html item 方法,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地址来测试

点击按钮来获得 body 元素0个子节点的名称。

点击按钮来获得 body 元素1个子节点的名称。

点击按钮来获得 body 元素2个子节点的名称。

点击按钮来获得 body 元素3个子节点的名称。

试一下

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得到的是元素节点

}

下面来说明下item()的用法:

定义和用法

item() 方法节点列表中位于指定索引的节点。

以下两条语法产生相同的结果:

document.body.childNodes.item(0);

document.body.childNodes[0];

86896eff5a8c41dca539854ecf67aceb.jpg

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
以下是一个使用DOM解析XML的示例代码,假设我们要解析如下的XML文档: ```xml <?xml version="1.0" encoding="UTF-8"?> <bookstore> <book category="children"> <title lang="en">Harry Potter</title> <author>J.K. Rowling</author> <year>2005</year> <price>29.99</price> </book> <book category="web"> <title lang="en">Learning XML</title> <author>Erik T. Ray</author> <year>2003</year> <price>39.95</price> </book> </bookstore> ``` 解析代码如下: ```java import javax.xml.parsers.DocumentBuilderFactory; import javax.xml.parsers.DocumentBuilder; import org.w3c.dom.Document; import org.w3c.dom.NodeList; import org.w3c.dom.Node; import org.w3c.dom.Element; import java.io.File; public class DomParserExample { public static void main(String[] args) { try { File inputFile = new File("input.xml"); DocumentBuilderFactory dbFactory = DocumentBuilderFactory.newInstance(); DocumentBuilder dBuilder = dbFactory.newDocumentBuilder(); Document doc = dBuilder.parse(inputFile); doc.getDocumentElement().normalize(); System.out.println("Root element :" + doc.getDocumentElement().getNodeName()); NodeList nList = doc.getElementsByTagName("book"); System.out.println("----------------------------"); for (int temp = 0; temp < nList.getLength(); temp++) { Node nNode = nList.item(temp); System.out.println("\nCurrent Element :" + nNode.getNodeName()); if (nNode.getNodeType() == Node.ELEMENT_NODE) { Element eElement = (Element) nNode; System.out.println("Category : " + eElement.getAttribute("category")); System.out.println("Title : " + eElement.getElementsByTagName("title").item(0).getTextContent()); System.out.println("Author : " + eElement.getElementsByTagName("author").item(0).getTextContent()); System.out.println("Year : " + eElement.getElementsByTagName("year").item(0).getTextContent()); System.out.println("Price : " + eElement.getElementsByTagName("price").item(0).getTextContent()); } } } catch (Exception e) { e.printStackTrace(); } } } ``` 运行以上代码,输出如下: ``` Root element :bookstore ---------------------------- Current Element :book Category : children Title : Harry Potter Author : J.K. Rowling Year : 2005 Price : 29.99 Current Element :book Category : web Title : Learning XML Author : Erik T. Ray Year : 2003 Price : 39.95 ``` 以上代码使用了Java标准库DOM解析器,首先通过`DocumentBuilderFactory`和`DocumentBuilder`创建解析器实例,然后使用`parse`方法解析XML文档。接着遍历XML文档的所有`book`元素,获取元素节点的属性和子节点的文本内容。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值