document.all与WEB标准（2）
发布时间：2008-03-16 14:28:00
4、标准DOM中的访问方法
开头就说过document.all[]不符合WEB标准，那用什么来替代它呢？document.getElementById
Most third-party browsers are “strict standards” implementations, meaning that they implement W3C and ECMA standards and ignore most of the proprietary object models of Internet Explorer and Netscape.If the demographic for your Web site includes users likely to use less common browsers, such as Linux aficionados, it might be a good idea to avoid IE-specific features and use the W3C DOM instead. by Internet Explorer 6, we see that IE implements significant portions of the W3C DOM.
这段话的意思是大多数第三方浏览器只支持W3C的DOM，如果你的网站用户使用其他的浏览器，那么你最好避免使用IE的私有属性。而且IE6也开始支持W3C DOM。
毕竟大多数人还不了解标准，在使用标准前，你还可以在你的网页中用document.all[]访问文档对象前面写到WEB标准，今天继续WEB标准下可以通过getElementById(), getElementsByName(), and getElementsByTagName()访问DOCUMENT中的任一个标签：
1、getElementById()
getElementById()可以访问DOCUMENT中的某一特定元素，顾名思义，就是通过ID来取得元素，所以只能访问设置了ID的元素。
比如说有一个DIV的ID为docid：<div id="docid"></div>
那么就可以用getElementById("docid")来获得这个元素。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>ById</title>
<style type="text/css">
<!--
#docid{
height:400px;
width:400px;
background-color:#999;}
-->
</style>
</head>
<body><div id="docid" name="docname" onClick="bgcolor()"></div>
</body>
</html>
<script language="javascript" type="text/javascript">
<!--
function bgcolor(){
document.getElementById("docid").style.backgroundColor="#000"
}
-->
</script>
2、getElementsByName()
这个是通过NAME来获得元素，但不知大家注意没有，这个是GET ELEMENTS，复数ELEMENTS代表获得的不是一个元素，为什么呢？
因为DOCUMENT中每一个元素的ID是唯一的，但NAME却可以重复。打个比喻就像人的身份证号是唯一的（理论上，虽然现实中有重复），但名字重复的却很多。如果一个文档中有两个以上的标签NAME相同，那么getElementsByName()就可以取得这些元素组成一个数组。
比如有两个DIV：
<div name="docname" id="docid1"></div>
<div name="docname" id="docid2"></div>
那么可以用getElementsByName("docname")获得这两个DIV，用getElementsByName("docname")[0]访问第一个DIV，用getElementsByName("docname")[1]访问第二个DIV。
下面这段话有错，请看forfor的回复，但是很可惜，IE没有支持这个方法，大家有兴趣可以在FIREFOX或NETSCAPE中调试下面这个例子。（我在NETSCAPE7.2英文版和FIREFOX1.0中调试成功。）
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>Byname,tag</title>
<style type="text/css">
<!--
#docid1,#docid2{
margin:10px;
height:400px;
width:400px;
background-color:#999;}
-->
</style>
</head>
<body>
<div name="docname" id="docid1" onClick="bgcolor()"></div>
<div name="docname" id="docid2" onClick="bgcolor()"></div>
</body>
</html>
<script language="javascript" type="text/javascript">
<!--
function bgcolor(){
var docnObj=document.getElementsByName("docname");
docnObj[0].style.backgroundColor = "black";
docnObj[1].style.backgroundColor = "black";
}
-->
</script>
看来最新版浏览器理解WEB标准还是有问题，我知道的只有盒模型、空格BUG、漂浮BUG、FLASH插入BUG，从document.getElementsByName可以看出FIREFOX，NETSCAPE理解标准有偏差，但forfor说的对：要灵活应用标准。
3、getElementsByTagName()
这个呢就是通过TAGNAME（标签名称）来获得元素，一个DOCUMENT中当然会有相同的标签，所以这个方法也是取得一个数组。
下面这个例子有两个DIV，可以用getElementsByTagName("div")来访问它们，用getElementsByTagName("div")[0]访问第一个DIV，用getElementsByTagName("div")[1]访问第二个DIV。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>Byname,tag</title>
<style type="text/css">
<!--
#docid1,#docid2{
margin:10px;
height:400px;
width:400px;
background-color:#999;}
-->
</style>
</head>
<body>
<div name="docname" id="docid1" onClick="bgcolor()"></div>
<div name="docname" id="docid2" onClick="bgcolor()"></div>
</body>
</html>
<script language="javascript" type="text/javascript">
<!--
function bgcolor(){
var docnObj=document.getElementsByTagName("div");
docnObj[0].style.backgroundColor = "black";
docnObj[1].style.backgroundColor = "black";
}
-->
</script>
0
投稿猜你喜欢
- 在MongoDB中的ObjectID，可以理解为是一个不会重复的ID，这里有个链接https://www.aspxhome.com/arti
一、背景近期项目即将开展，计划第一步就是实现数据的可视化，所以先学习一下数据展示相关Demo。选用Python2.7与Matplotlib来- eval(String) 函数可计算某个字符串，并执行其中的的 JavaScript 代码。返回值通过计算 string 得到的值（如果有的
- 接触过 Django 的同学都应该十分熟悉它的 ORM 系统。对于 python 新手而言，这是一项几乎可以被称作“黑科技”的特性：只要你在
- 这篇文章主要介绍了python实现实时视频流播放代码实例,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的
- #!/usr/bin/python#coding:utf-8#write:JACK#info:ftp exampleimport ftpli
- 最近做接口对接，遇到了.net开发的webservice接口，因为python第一次与webservice对接，连问带查，最后使用suds库
- 一、配置webdriver下载谷歌浏览器驱动，并配置好import timeimport randomfrom PIL import Ima
- 支付宝lab的意思是支付宝实验室，也就是概念产品聚集地，可以让用户快速试用这些新产品。本次支付宝lab logo设计历时一个星期，视觉设计组
- 1. # 可以使用LaTeX表示数学公式# 可以使用LaTeX表示数学公式from IPython.display import Latex
- 前面的话分页导航几乎在每个网站都可见，好的分页能给用户带来好的用户体验。本文将详细介绍Bootstrap分页概述在Bootstrap框架中提
- 中文文本中可能出现的标点符号来源比较复杂，通过匹配等手段对他们处理的时候需要格外小心，防止遗漏。以下为在下处理中文标点的时候采用的两种方法:
- Python3的 元组(Tuple)Python 的元组与列表类似，不同之处在于元组的元素不能修改。元组使用小括号 ( )，列表使用方括号
- 上线 Django 项目记录，超简单，避免无意义的踩坑！第一步：安装python管理器在宝塔在线面板安装“ python项目管理器 ”第二步
- 实时读取logstash日志，有异常错误keywork即触发报警。# /usr/bin/env python3# -*- coding: u
- 引言欢迎来到我们的系列博客《Python全景系列》！在这个系列中，我们将带领你从Python的基础知识开始，一步步深入到高级话题，帮助你掌握
- 前言：集合这个词应该比较耳熟，大多数人没接触代码前就学过了。回想一下你的高一数学课本上是不是出现过这个词，就在第一章，概念如下：一般地，我们
- 类的代码: define('QR_MODE_NUL', -1); define('QR_MODE_NUM',
- 从信息组织角度来看，段落内行之间的关系要比段落之间的关系低一个级别，所以在呈现上段落之间的“段距”应该大于段落之内的“行距”，如此才能一目了
- 本文实例讲述了Python计时相关操作。分享给大家供大家参考，具体如下：内容目录：1. 时间戳2. 当前时间3. 时间差4. python中
