setAttribute()的使用方法与ie不兼容onclick事件解决方法
1.element要用getElementById or ByTagName来得到,
2.setAttribute("class", vName)中class是指改变"class"这个属性,所以要带引号。
3.IE中要把class改成className,.....IE不认class,所以最好写两句,都用上吧。
W3C DOM - {setAttribute()}
setAttribute(string name, string value):增加一个指定名称和值的新属性,或者把一个现有的属性设定为指定的值。
1、关于class和className
class属性在W3C DOM中扮演着很重要的角色,但由于浏览器差异性仍然存在。使用setAttribute("class", vName)语句动态设置
Element的class属性在firefox中是行的通的,在IE中却不行。因为使用IE内核的浏览器不认识"class",要改用"className";
同样,firefox 也不认识"className"。所以常用的方法是二者兼备:
element.setAttribute("class", vName);
element.setAttribute("className", vName); //for IE
2、setAttribute()的差异
我们经常需要在JavaScript中给Element动态添加各种属性,这可以通过使用setAttribute()来实现,这就涉及到了浏览器的兼容性问题。
var bar = document.getElementById("foo");
bar.setAttribute("onclick", "javascript:alert('This is a test!');");
这里利用setAttribute指定e的onclick属性,简单,很好理解。但是IE不支持,IE并不是不支持setAttribute这个函数,而是不支持用setAttribute设置某些属性,例如对象属性、集合属性、事件属性,也就是说用setAttribute设置style和onclick这些属性在IE中是行不通的。为达到兼容各种浏览器的效果,可以用点符号法来设置Element的对象属性、集合属性和事件属性。
程序代码document.getElementById("foo").className = "fruit";
document.getElementById("foo").style.cssText = "color: #00f;";
document.getElementById("foo").style.color = "#00f";
document.getElementById("foo").onclick = function () { alert("This is a test!"); }
//注意1.这里的function这一段千万不要画蛇添足用引号引上,不信你可以试下,引上点click就没反应了
//注意2.onclick后面的方法不能传参数,例如要去调方法set_top_visible,需要参数
错误的写法:img.onclick = set_top_visible("none");
正确的写法:img.onclick = function(){set_top_visible("none");}
function set_top_visible(v){
(!v) && (v = "block");
try
{
document.getElementById("top_tooltip").style.display=v;
}
catch(e){}
}
例如要去调方法showMsg,不需要参数
错误的写法:img.onclick = showMsg();
正确的写法:img.onclick = showMsg;
function showMsg(){
alert('hello!');
}
分享到:
相关推荐
IE8中的JavaScript点击...因此,在使用这些方法时,务必确保传递给`eval`的字符串是可控的,最好不与用户输入直接相关,或者寻找更安全的替代方案,比如使用现代的事件处理机制、通过模板字符串来构建代码字符串等。
当尝试使用`setAttribute`的`'onclick'`等事件属性时,IE6可能会忽略这些设置,导致事件处理程序无法正常工作。 这个问题的核心在于,IE6不通过`setAttribute`来处理DOM元素的事件绑定,而是需要使用`attachEvent`...
### IE浏览器中的JavaScript不兼容性问题及解决方案 #### 一、Table操作问题 ...通过以上方法,我们可以有效地解决JavaScript在IE浏览器中的一些不兼容性问题,并提高Web应用的兼容性和用户体验。
具体来说,在早期的Internet Explorer(IE)浏览器中,直接使用`setAttribute`方法来设置`onclick`事件监听器可能会不起作用,而相同的代码在Firefox等其他浏览器中却可以正常工作。这是因为不同浏览器对`...
通用的方法是使用`getAttribute`和`setAttribute`方法,如`div1.getAttribute("value")`和`div1.setAttribute("value", val)`。 综上所述,解决JavaScript的浏览器兼容性问题通常需要对各个浏览器的特性有深入理解...
- **设置点击事件**: 在绑定事件处理程序时,Firefox支持直接使用`element.onclick = function() {...}`的形式,而IE需要通过`setAttribute`来实现。 - Firefox中可以直接使用`obj.onclick = function(){func();}`...
在不同的浏览器中,实现方式略有差异,主要涉及到IE浏览器与非IE浏览器的兼容性问题。以下是关于JavaScript动态添加事件的一些关键知识点: 1. **setAttribute方法**: - `setAttribute` 是一个通用的方法,用于...
然而,IE并不支持这种方式,它需要使用“标记法”来设置事件处理程序,这意味着你需要将处理函数直接绑定到事件上,通常是通过匿名函数来实现: ```javascript document.getElementById("id").onclick = function()...
对于IE浏览器,我们需要使用方法二,即`attachEvent`。这是一个IE特有的方法,用于添加事件监听器: ```javascript obj.attachEvent("onclick", Foo); function Foo() { alert("测试"); } ``` 而在非IE浏览器中,...
- 注意,直接使用`setAttribute`设置样式属性(如`style`)在IE中可能不生效,应使用点符号法来设置样式,如`element.style.color = "#00f"`。 4. **方法属性和事件属性**: - `setAttribute`不适用于设置对象...
总之,要处理IE和Firefox下`createElement`方法的差异,可以使用jQuery提供的跨浏览器功能,如`$`函数和事件绑定方法,来统一创建元素和添加事件监听器的方式。这样不仅可以简化代码,还能提高代码的可维护性和兼容...
不过,需要注意的是,IE并不支持使用`setAttribute()`来设置某些特定属性,特别是对象属性、集合属性和事件属性,如`style`和`onclick`。在这种情况下,我们应该使用点符号法(dot notation)来代替: ```...
但需要注意的是,`setAttribute`在Internet Explorer浏览器中对于某些属性(如对象属性、集合属性和事件属性)的支持有限,包括`style`、`onclick`、`onmouseover`等,因此在IE中使用这种方法可能无法正常工作。...
有些时候需要动态加载javascript事件的一些方法往往我们需要在 JS 中动态添加事件,这就涉及到浏览器兼容性问题了,以下谈及的几种方法,我们也常常混合使用。 方法一、setAttributevar obj = document....
测试环境(客户端浏览器 ) IE6,IE7, IE8兼容模式, IE8 Firefox 3.6.8, google chrome 5.0.375.125 先来说明两个函数的标准定义。 elementNode.setAttribute(name,value) name 必需。规定要设置的属性名。 value ...