DOM(二)使用DOM

在了解DOM(文本对象模型)的框架和节点后,最重要的是使用这些节点处理html网页

对于一个DOM节点node,都有一系列的属性和方法可以使用。常用的有下表。

1.访问节点



BOM提供了一些边界的方法访问节点,常用的就是getElementsByTagName(),和getElementById()

<script type="text/javascript">
    function searchDOM(){
        var oLi = document.getElementsByTagName("li");
       var j =oLi.length;
       var j2 =oLi[5].tagName;
        var j3 =oLi[0].childNodes[0].nodeValue;
        document.write(j+"<br>"+j2+"<br>"+j3+"<br>");

    }

</script>
<body>

<body >
<div id-"in"></div>
<ul>客户端语言
    <li>HTML</li>
    <li>JavaScript</li>
    <li>CSS</li>
</ul>
<ul>服务器端语言
    <li>ASP.NET</li>
    <li>JSP</li>
    <li>PHP</li>
</ul>

</body>
时间: 2024-10-10 04:25:51

DOM(二)使用DOM的相关文章

javascript系列之DOM(二)

原生DOM扩展 我们接着第一部分来说,上文提到了两种常规的DOM操作:创建文档片段和遍历元素节点.我们知道那些雨后春笋般的库,有很大一部分工作就是提供了一些优秀 的DOM操作API.可见原生的一些方法和属性,还不能很灵活快捷的来完成我们所希望的操作.下面将总结出总结出几种很实用的扩展方法.包括 after()和before(), A:after()和before() 1 function after(elem){ 2 if(this.parentNode){ 3 this.parentNode.

jquery学习(二)-DOM操作

来自锋利的jquery第二版 一.DOM分类 DOM分为3类DOM Core(核心).HTML-DOM.CSS-DOM 1.DOM Core:其并不专属于javascript,任何一种支持DOM程序设计的语言都可以使用它.如javascript中的getElementById.getElementByTagName.getAttibute和setAttribute等方法,就是DOM Core的组成部分. 2.HTML-DOM:其比DOM Core出现的还要早,它提供了一些更简明的记号来描述各种H

QT开发(四十二)——DOM方式解析XML

QT开发(四十二)--DOM方式解析XML 一.DOM简介 1.DOM简介 DOM是Document Object Model的简写,即XML文档对象模型,是由W3C提出的一种处理XML文档的标准接口. DOM 一次性读入整个XML文档,在内存中构造为一棵树(DOM树)将XML文件表示成一棵树,便于随机访问其中的节点,但消耗内存相对多一些.能够在这棵树上进行导航,比如移动到下一节点或者返回上一节点,也可以对这棵树进行修改,或者是直接将这颗树保存为硬盘上的一个 XML 文件. 2.XML DOM节

Java SE之XML&lt;二&gt;XML DOM与SAX解析

[文档整理系列] Java SE之XML<二>XML DOM与SAX解析 XML编程:CRUD(Create Read Update Delete) XML解析的两种常见方式: DOM(Document Object Model): 特点:树状解析 优点:[更适合对XML文档的(crud)操作.]对XML文档增删改查操作很方便灵活 缺点:内存消耗很大,不适合数据量很大,节点很多的XML文档. SAX(Simple API for XML): 特点:自上往下顺序解析 优点:[占用内存小,解析速度

js学习总结:DOM节点二(dom基本操作)

一.DOM继承树 DOM--Document Object Model DOM定义了表示修改文档所需要的方法.DOM对象即为宿主对象,由浏览器厂商定义,用来操作html和xml的一类厂商定义,也有人称DOM是对HTML以及xml的标准编程接口. 继承树模型图: 1.document继承于HTMLDocument,而HTMLDocument继承于Document; 2.文本节点对象Text与注释节点对象Comment继承于CharacterData 3.在Element节点下其实存在两个子节点,除

JavaScript DOM(二)之Document类型

Document类型简介 javaScript通过Document类型表示文档:因此我们称document 为文挡对象,在浏览器中, document对象是HTMLDocument的一个实例,表示整个HTML页面,而且,document对象是window对象的一个属性,因为可以作为一个全局对象来访问: Document类型特征 1:nodeType的值为9; 2:nodeName的值为"#document"; 3:nodeValue的值为null; 4:parentNode的值为nul

【DOM】1.DOM优化

1.JS include :DOM BOM ECMA 2.Browser 分别独立实现dom & JS as if two isolated islands 3.JS操作DOM from the island to the other one 4.DOM性能 The bridges between islands,charge everytime passing by 尽量减少过桥次数 5.innerHTML vs dom method webkit:eg, chrome, dom>inne

DOM扩展:DOM API的进一步增强[总结篇-下]

本文承接<DOM扩展:DOM API的进一步增强[总结篇-上]>,继续总结DOM扩展相关的功能和API. 3.6 插入标记 DOM1级中的接口已经提供了向文档中插入内容的接口,但是在给文档插入大量HTML标记的时候操作还是很繁杂的,每次插入一个元素,不仅要调用创建元素和文本节点的接口,还要调用appendChild等向文档中添加元素的接口,而且在添加时还要按照正确的顺序.而如果使用插入标记的方法,直接向文档中插入HTML字符串,由执行环境自动解析HTML字符串并创建相应的节点并添加到文档中,这

走进DOM:HTML DOM

DOM(Document Object Model)即文档对象模型.针对HTML和XML 文档的API(应用程序接口). DOM描绘了一个层次化的节点树,执行开发者加入.移除和改动页面的某一部分.当然这样说有些笼统.咱们接着往下看. 一.认识DOM DOM 中的三个字母.D(文档)能够理解为整个Web载入的网页文档.O(对象)能够理解为类似window对象之类的东西.能够调用属性和方法,这里我们说的是document对象:M(模型)能够理解为网页文档的树型结构. 通过 JavaScript,您能

Dom Animator – 提供 Dom 注释动画的 JS 库

DOM 动画是一个极好的 JavaScript 库,用来在页面的 DOM 注释中显示小的 ASCII 动画.这对于那些检查你的代码的人是一个小彩蛋,仅此而已.它是一个独立的库,不依赖 jQuery 或者其它库,所以使用是非常简单的.您不需要任何 CSS 或 HTML,只是 JavaScript 而已. 在线演示      源码下载 您可能感兴趣的相关文章 网站开发中很有用的 jQuery 效果[附源码] 分享35个让人惊讶的 CSS3 动画效果演示 十分惊艳的8个 HTML5 & JavaScr