首頁 >web前端 >js教程 >javascript setAttribute, getAttribute 在不同浏览器上的不同表现_javascript技巧

javascript setAttribute, getAttribute 在不同浏览器上的不同表现_javascript技巧

PHP中文网
PHP中文网原創
2016-05-16 18:21:381289瀏覽

测试环境(客户端浏览器 )
IE6,IE7, IE8兼容模式, IE8
Firefox 3.6.8, google chrome 5.0.375.125

先来说明两个函数的标准定义。
elementNode.setAttribute(name,value)
name 必需。规定要设置的属性名。
value 必需。规定要设置的属性值。
该方法把指定的属性设置为指定的值。如果不存在具有指定名称的属性,该方法将创建一个新属性。

elementNode.getAttribute(name)
name 必需。规定从中取得属性值的属性。

一、setAttribute的问题
elementNode为...

希望对其增加一个单击行的事件处理函数,
写法1:

table1row1.setAttribute("onclick", "selectrow1(this)");


IE8, Firefox, google chrome 能正确触发click 事件
IE6,IE7则不能触发click 事件。
写法2:

table2row1.onclick = function() { selectrow2(this) };

所有测试浏览器均能触发click 事件

故为了兼容在不同的IE中,我们可以统一使用如下语句。 

table2row1.onclick = function() { selectrow2(this) };

二、getAttribute的问题
elementNode为...
先用setAttribute设置属性
table1row1.setAttribute("level", 1);
再用getAttribute来获取标签的属性值
var level = table1row1.getAttribute("level");
alert("table1row1 level:" + level + "\r\ntypeof(level) = " + (typeof (level)).toString());
在IE6,7 中显示

table1row1 level:1
typeof(level) = number

在IE8, Firefox, google chrome中显示



table1row1 level:1
typeof(level) = string
为统一处理此两种情况,代码统一如下: 

代码如下:

var level = table1row1.getAttribute("level"); 
if (level === undefined || level == null) { 
level = "0"; 
} 
level = level.toString(); 
if (level.trim() == "") { 
level = "0"; 
}

或者使用ajax方法
$addHandler 是Sys.UI.DomEvent.addHandler 的快捷方式,它的语法为:
$addHandler(element, eventName, handler);
element 公开事件的 DOM 元素。
eventName 事件的名称。
handler 要添加的事件处理程序。
前面的语句可以写成这样:
$addHandler(row,"click", function() { selectrow(this) });

代码如下:

 
 
 
Test 
 
 
 
table1
No. Item
1 2C.40E80.041
2 4L.013Y2.003

table2
No. Item
1 4G.0QE18.001
2 2K.61209.208

以上就是javascript setAttribute, getAttribute 在不同浏览器上的不同表现_javascript技巧的内容,更多相关内容请关注PHP中文网(www.php.cn)!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn