document.all与WEB标准

2016-02-19 11:45 6 1 收藏

岁数大了,QQ也不闪了,微信也不响了,电话也不来了,但是图老师依旧坚持为大家推荐最精彩的内容,下面为大家精心准备的document.all与WEB标准,希望大家看完后能赶快学习起来。

【 tulaoshi.com - Web开发 】

1、DOM

  WEB标准现在可真是热门中热门,不过下面讨论的是一个不符合标准的document.all[]。DOM--DOCUMENT OBJECT MODEL文档对象模型,提供了访问文档对象的方法.例如文档中有一个table,你要改变它的背景颜色,那就可以在javascript中用document.all[]访问这个TABLE。但DOM也有所不同,因为浏览器厂商之间的竞争,各浏览器厂商都开发了自己的私有DOM,只能在自己的浏览器上正确运行,document.all[]就是只能运行在 IE是的微软的私有DOM。为了正确理解DOM,给出IE4的DOM

  2、理解document.all[]

  从IE4开始IE的object model才增加了document.all[],来看看document.all[]的Description:
Array of all HTML tags in the document.Collection of all elements contained by the object.

  也就是说document.all[]是文档中所有标签组成的一个数组变量,包括了文档对象中所有元素(见例1)。

  IE's document.all collection exposes all document elements.This array provides access to every element in the document.

  document.all[]这个数组可以访问文档中所有元素。

  例1(这个可以让你理解文档中哪些是对象)



  例2(访问一个特定元素) 




  上面的这个例子让你了解怎么访问文档中的一个特定元素,比如文档中有一个DIV
div id="docid" name="docname"/div,你可以通过这个DIV的ID,NAME或INDEX属性访问这个DIV:

代码如下:
document.all["docid"] 
document.all["docname"] 
document.all.item("docid") 
document.all.item("docname") 
document.all[7] 
document.all.tags("div")则返回文档中所有DIV数组,本例中只有一个DIV,所以用document.all.tags("div")[0]就可以访问了。 
  3、使用document.all[]

例3



  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")来获得这个元素。



  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中调试成功。)



  看来最新版浏览器理解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。


  总结一下标准DOM,访问某一特定元素尽量用标准的getElementById(),访问标签用标准的getElementByTagName(),但IE不支持getElementsByName(),所以就要避免使用getElementsByName(),但getElementsByName()和不符合标准的document.all[]也不是全无是处,它们有自己的方便之处,用不用那就看网站的用户使用什么浏览器,由你自己决定了。

  关于document.getElementsByName

  IE当然支持 可以说IE更忠于html/xhtml标准(嘿嘿 原来firefox也不咋地 幸灾乐祸一下^_^)

  按照O'REILLY的HTML与XHTML权威指南中的说法 name并不是核心属性 并非所有标签都可以加name属性(大家可以拿我下面的例子去 validator.w3.org 做验证)

  所以你给div加name属性理论上是不会出结果的.这一点IE很好的符合了标准~!!

  (同时也看出了符合标准也有烦人的地方~_~ 所以大家不用太把标准当回事儿 过两年都用xml了 这个也过时了!倡导灵活的webstandard应用思想 除了符合xml思想的东西 其他的按浏览器的理解去做就行)

附: 




  简单来说就是DIV不支持NAME属性,所以那个document.getElementsByName的例子调试不能通过.
下面用INPUT做个例子


来源:http://www.tulaoshi.com/n/20160219/1598495.html

延伸阅读
标签: Web开发
上文:IE7与web标准设计(2) IE历来被web标准的拥护者所诟病,而当FireFox横空出世以后,更多的网页制作者开始关注web标准设计。看着FireFox的市场占有率不停的上升,微软终于推出了IE7。但IE7是否真的能够力挽狂澜,是否真的能够得到用户的信任,是否真的能够得到网页设计者的认可呢? 且看《IE7的web标准之道》系列文章,和你一起见证I...
标签: Web开发
Web标准这个词听说好久了,但是到底什么是Web标准呢?我们该如何实现Web标准呢?DIV+CSS布局是Web标准吗?实现Web标准到底有什么好处呢? 不知上面这些问题大家以前是怎么认为的,至少我以前很傻乎乎的认为Div+CSS布局就是符合Web标准。下面是布鲁斯狼和其老友的一段聊天对话,看完后希望大家在对Web标准的理解上有进一步的提高和认识! ...
标签: Web开发
引言: 一群会用table蹩脚布局的网页初学者嘲笑着那些对网页制作一窍不通的门外汉;而一群自认为 table布局无所不能的table布局拥护者则嘲笑着那群用table蹩脚布局的网页初学者;那些刚试着将几个页面中的table换成div的所谓的 web标准设计者则嘲笑这那群死抱table布局不放的table布局设计者;而一群焦头烂额终于在网站上贴上W3C...
标签: Web开发
混淆文档类型(DOCTYPE) 完全不写、写的不正确、或放错地方。我曾见过HTML 4.0 Transitional被用在XHTML网页和框架页中,还看到过在开头的html标签后写DOCTYPE声明和一些不完整的声明。 为什么?有两个原因。首先,文档声明是必须的,在W3C HTML 4.01 spec和W3C XHTML 1.0 spec里都有说明。第二,浏览器会根据指定的文档类型去显示和渲染网...
  准备工作: 1.选择 !DOCTYPE    过渡的(Transitional):    要求非常宽松的DTD,它允许你继续使用HTML4.01的标识(但是要符合xhtml的写法)。虽然W3C不赞成使用<font等标签,但是还是有很多网页爱好者在很喜欢用,所以W3C不得不把font补进到HTML 4.0的标准中.因此使用过渡式你还可以使用这些标...

经验教程

250

收藏

59
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部