在DOM中，每个元素都有一或多个特性,这些特性的用途是给出相应元素或其内容的附加信息。操作特性的DOM方法主要有三个,分别是getAttribute()、setAttribute()和removeAttribute()。这三个方法可以针对任何特性使用,包括那些以HTMLElement类型属性的形式定义的特性。来看下面的例子：

var div=document.getElementByld("myDiv");

alert(div.getAttribute( "id")); "myDiv"

alert(div. getAttribute("class")); "bd"

alert(div. getAttribute("title")); "Body text"

alert(div. getAttribute("lang")); "en"

alert(div. getAttribute( "dir")); "ltr"

注意,传递给getAttribute()的特性名与实际的特性名相同。因此要想得到class特性值,应该传人" class"而不是 "clas sName",后者只有在通过对象属性访问特性时才用。如果给定名称的特性不存在,getAttribute()返回null。

通过getAttribute()方法也可以取得自定义特性(即标准HTML语言中没有的特性)的值,以 下面的元素为例：

这个元素包含一个名为my_special_attribute的自定义特性,它的值是"hello!"。可以像取得其他特性一样取得这个值,如下所示：

var value=div.getAttribute("my_special_attribute");

不过,特性的名称是不区分大小写的,即"ID"和"id"代表的都是同一个特性。

任何元素的所有特性,也都可以通过DOM元素本身的属性来访问。当然,HTMLElement也会有 5个属性与相应的特性一一对应。不过,只有公认的(非自定义的)特性才会以属性的形式添加到DOM

对象中。以下面的元素为例：

因为id和align在HTML中是

的公认特性,因此该元素的DOM对象中也将存在对应的属性。不过,在此南昌网站设计公司百恒网络开发工程师提示大家自定义特性my_special_attribute在Safari、Opera、Chrome及Firefox中是不存在的; 但IE却会为自定义特性也创建属性,如下面的例子所示： alert (div. id); "myDiv"

alert(div.my_special_attribute); //undefined(IE除外)

alert( div. align); "left"

有两类特殊的特性,它们虽然有对应的属性名,但属性的值与通过getAttribute()返回的值并 不相同。第一类特性就是style,用于通过CSS为元素指定样式。在通过getAttribute()访问时, 返回的style特性值中包含的是CSS文本,而通过属性来访问它则会返回一个对象。由于style属性是用于以编程方式访问元素样式的(本章后面讨论),因此并没有直接映射到style特性。

第二类与众不同的特性是onclick这样的事件处理程序。当在元素上使用时,onclick特性中包含的是JavaScript代码,如果通过getAttribute()访问,则会返回相应代码的字符串。而在访问

onclick属性时,则会返回一个JavaScript函数(如果未在元素中指定相应特性,则返回null)。这是因为onclick及其他事件处理程序属性本身就应该被赋予函数值。

由于存在这些差别,在通过JavaScript以编程方式操作DOM时,开发人员经常不使用getAttribute(),而是只使用对象的属性。只有在取得自定义特性值的情况下,才会使用getAttribute()方法。

与getAttribute()对应的方法是setAttribute(),这个方法接受两个参数：要设置的特性名和值。如果特性已经存在,setAttribute()会以指定的值替换现有的值;如果特性不存在,setAttribute()

则创建该属性并设置相应的值。来看下面的例子：

div.setAttribute('id", "BaiHengld");

div. setAttribute("class", "ft");

div.setAttribute("title", "BaiHengURL:http://www.jxbh.cn");

div. setAttribute( " lang", "fr");

div. setAttribute( "dir", "rtl ");

通过setAttribute()方法既可以操作HTML特性也可以操作自定义特性。通过这个方法设置的特性名会被统一转换为小写形式,即"ID"最终会变成"id"。

因为所有特性都是属性,所以直接绐属性赋值可以设置特性的值,如下所示：

div. id="someOtherld";

div.align="left";

不过,像下面这样为DOM元素添加一个自定义的属性,该属性不会自动成为元素的特性：

div.mycolor="red";

alert( div.getAttribute("mycolor")); //null(IE除外)

这个例子添加了一个名为mycolor的属性并将它的值设置为"red"。在大多数浏览器中,这个属性都不会自动变成元素的特性,因此想通过getAttribute()取得同名特性的值,结果会返回null。

可是,自定义属性在IE中会被当作元素的特性,反之亦然。

要介绍的最后一个方法是removeAttribute(),这个方法用于彻底删除元素的特性。调用这个方法不仅会清除特性的值,而且也会从元素中完全删除特性,如下所示：

div.removeAttribute("class");

这个方法并不常用,但在序列化DOM元素时,可以通过它来确切地指定要包含哪些特性。

本文仅限内部技术人员学习交流,不得作于其他商业用途.希望此文对广技人员有所帮助。原创文章出自:南昌网站建设公司-百恒网络 http: //www.jxbh.cn 如转载请注明出处!