<!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. Microsoft 2013 新技术学习笔记 一

    有几年没有关注技术了,最近有点时间想把技术重新捡起来,借着重构手上的一个后台管理框架的机会将微软新的几种技术全部应用一下,从目的上来讲并没有希望能对涉及的技术有很深入的了解,所以这个系列的文章(篇幅不 ...

  2. URAL 1549 Another Japanese Puzzle（构造）

    题目大意 构造一条闭合路线,使得路线不能相交,并且走直线的步数小于等于 S,转弯(左转和右转)的步数小于等于 T.(0≤S,T≤1000) 求一条最长的路线 做法分析 注意到,因为要求路线闭合,那么转 ...

  3. Fiddler捕捉ASP.NET WebSite调用WebService、WCF服务

    Fiddler默认会注册一个代理,有时会发现WebSite调用的WebService或者WCF服务无法被捕捉到.其实是由于运行的站点关联的应用程序池使用的账号和我们当前登陆操作系统的用户不同,自然它们 ...

  4. Apk去签名校验详解

    某些apk为了防止重打包,使用了签名校验.所以在破解的时候我们需要破解签名校验.在定位签名校验位置时常用的关键词有sign,signature,checkSign,signCheck,getPacka ...

  5. 代码演示用 KnockoutJS 和 Web API 对一个表格（Gird）进行 CRUD 操作，在 MVC 5 下

    实体类: using System; using System.Collections.Generic; public partial class EmployeeInfo { public int ...

  6. Logstash日志搜集

    软件准备: logstash-2.1.0.zip elasticsearch-2.1.0.zip kibana-4.3.0-windows.zip Redis-x64-2.8.2104.msi 下载地 ...

  7. POJ 3345 Bribing FIPA 树形DP

    题目链接: POJ 3345 Bribing FIPA 题意: 一个国家要参加一个国际组织,  需要n个国家投票,  n个国家中有控制和被控制的关系, 形成了一颗树. 比如: 国家C被国家B控制, 国 ...

  8. centos 一键安装jdk

    先检查 yum list installed |grep java 卸载JDK相关文件输入:yum -y remove java-1.7.0-openjdk*. 卸载tzdata-java输入:yum ...

  9. PintJS – 轻量，并发的 GruntJS 运行器

    PintJS 是一个小型.异步的 GruntJS 运行器,试图解决大规模构建流程中的一些问题. 典型的Gruntfile 会包括 jsHint,jasmine,LESS,handlebars, ugl ...

  10. cocos2dx-3.x 导出自定义类到 lua 过程详解

    转载请注明出处:http://www.cnblogs.com/Ray1024 一.简介 最近正在学习cocos2d中的lua游戏开发,因为lua开发的热更新特性,大家开发游戏好像都会优先选择lua作为 ...