<!DOCTYPE html>

 <html>

     <head>

         <meta charset="UTF-8">

         <title>js的DOM对象</title>

         <script type="text/javascript">

             // DOM：Document Object Model 文档对象模型

             /*

                 文档：超文本文档html、xml

                 对象：提供了属性和方法

                 模型：使用属性和方法操作超文本标记型文档

                 可以使用js的DOM提供的对象，使用这些对象的属性和方法，对标记型文档进行操作

                 需要把HTML里面的标签、属性、文本内容都封装成对象

              */

              /*

                 DOM模型有三种

                     DOM level 1：将HTML文档封装成对象

                     DOM level 2：在level 1的基础上添加新的功能，例如：对于事件和CSS样式的支持

                     DOM level 3：支持XML 1.0的一些新特性

              */

              /*

                 解析过程

                     根据HTMl的层级结构，在内存中分配一个树形结构，需要把HTML中的每部分封装成对象

                 document：整个HTML文档

                 element：标签对象

                 属性对象

                 文本对象

                 Node节点对象：是这些对象的父对象

              */

              /*

                 常用属性

                     all[]提供对文档中所有HTML元素的访问，FF不支持

                     forms[]返回对文档中所有Form对象引用

                     body提供对<body>元素的直接访问

                 常用方法

                     getElementById()返回对拥有指定id的第一个对象的引用

                     getElementsByName()返回带有指定名称的对象集合

                     getElementsByTagName()返回带有指定标签名的对象集合

                     write()向文档写HTML代码或JavaScript代码

              */

              window.onload = function() {

                 var spans = document.getElementsByTagName("span")[1];

                 //for (var i = 0; i < spans.length; i++)

                 //{

                     //var span = spans[i];

                     document.write("<br />span:" + spans.innerHTML);

                 //}

              }

         </script>

     </head>

     <body>

         <br /><br /><br />

         <span>AAAAA</span>

         <span>BBBBB</span>

         <span>CCCCC</span>

         <span>DDDDD</span>

     </body>

 </html>

JavaScript基础15——js的DOM对象的更多相关文章

  1. JavaScript基础17——js的Date对象

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  2. JavaScript基础18——js的Array对象

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  3. JavaScript基础16——js的BOM对象

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  4. JavaScript基础14——js的Math对象

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  5. JavaScript基础13——js的string对象

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  6. 前端之JavaScript：JS之DOM对象三

    js之DOM对象三   一.JS中for循环遍历测试 for循环遍历有两种 第一种:是有条件的那种,例如    for(var i = 0;i<ele.length;i++){} 第二种:for ...

  7. 前端之JavaScript：JS之DOM对象二

    继续JS之DOM对象二 前面在JS之DOM中我们知道了属性操作,下面我们来了解一下节点操作.很重要!! 一.节点操作 创建节点:var ele_a = document.createElement(' ...

  8. 前端之JavaScript：JS之DOM对象一

    js之DOM对象一 一.什么是HTML  DOM HTML  Document Object Model(文档对象模型) HTML DOM 定义了访问和操作HTML文档的标准方法 HTML DOM 把 ...

  9. js的dom对象（带实例超详细全解）

    js的dom对象(带实例超详细全解) 一.总结 一句话总结: 1.DOM中的方法区分大小写么? 解答:区分 2.DOM中元素和节点的关系式什么? 解答:元素就是标签,节点中有元素节点,也是标签,节点中 ...

随机推荐

  1. Codeforces Round #184 (Div. 2) E. Playing with String（博弈）

    题目大意 两个人轮流在一个字符串上删掉一个字符,没有字符可删的人输掉游戏 删字符的规则如下: 1. 每次从一个字符串中选取一个字符,它是一个长度至少为 3 的奇回文串的中心 2. 删掉该字符,同时,他 ...

  2. 常用的sql语句（找不同位数，找重复）

    1.SQL找不同位数 select length(aae135),count(1) from ac01 group by  length(aae135) ; ————————————————————— ...

  3. 配置<authorization>节（配置文件）

    在 Web.config 文件的<configuration>标记的子标记<authorization>和</authorization>之间用于设置应用程序的授权 ...

  4. mount分区为读写属性

    对于只读文件系统, 如果想要挂载为可读写的, 需要重新mount下, 如将config分区mount为读写的分区: mount -o remount,rw /config

  5. WCF安全3-Transport与Message安全模式

    概述: WCF的安全传输主要涉及认证.消息一致性和机密性三个主题.WCF采用两种不同的机制来解决这三个涉及传输安全的问题,一般将它们成为不同的安全模式,即Transport安全模式和Message安全 ...

  6. ubuntu14.04编译安装Git2.7

    在开源中国看文章, 随意之间, 在软件资讯栏看到git 2.7的信息. 一直在使用在git 1.9.1, 心中突感, 这个git 2.7是个什么东西, 怎么git的版本更新有如此快么. 印象里, 老外 ...

  7. [OpenCV] Install openCV in Qt Creator

    Learn openCV.pdf qmake: link with opencv (Key Point) QT += core gui greaterThan(QT_MAJOR_VERSION, 4) ...

  8. 当他们也换成了Linux OS

    近期,斯诺登的事闹得沸沸扬扬,美帝损失了公信.又有传言说Win8给美帝安全局留了后门?XP依旧是生命力旺盛. 还不就是因为那点事儿,看不到人家的源代码? 斗胆提一个问题,如果公务员们或者是一部分,开始 ...

  9. 学习android开发笔记

    最近重点看了几个android工程的源代码,有几点疑问 1:为什么android客户端游戏要开启n个线程,而且通常每个线程的操作只有i++: 2:为什么很多列表在游戏逻辑和绘制逻辑里没有做同步: 3: ...

  10. C#对象与XMl文件之间的相互转换

    C#提供三种序列化方式,分别为: 1.是使用BinaryFormatter进行串行化: 2.使用SoapFormatter进行串行化: 3.使用XmlSerializer进行串行化.其中对于Binar ...