setAttribute()使用方法与IE兼容解决方法
我们经常需要在JavaScript中给Element动态添加各种属性,可以使用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、onclick
bar.setAttribute("onclick", "");这里利用setAttribute指定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!"); }
setAttribute()使用方法与IE兼容解决方法的更多相关文章
- IE6-7下margin-bottom不兼容解决方法(非原创,视频中看到的)
在IE低版本下有很多不兼容,现在将看到的 IE6-7下margin-bottom不兼容解决方法 演示一下,方便日后自己查阅. <!DOCTYPE html> <html la ...
- ie6,ie7,ie8 css bug兼容解决方法
IE浏览器以不支持大量的css 属性出名,同时也因其支持的css属性中存在大量bug. 这里收集了好多的bug以及其解决的办法,都在这个文章里面记录下来了!希望以后解决类似问题的时候能够快速解决,也希 ...
- ie6,ie7,ie8 css bug汇总以及兼容解决方法
1:li边距“无故”增加 任何事情都是有原因的,li边距也不例外. 先描述一下具体状况:有些时候li边距会突然增 加很多,值也不固定(只在IE6/IE7有这种现象),让人摸不着头脑,仔细“研究”发现是 ...
- 火狐min-height不兼容解决方法
我们在进行页面架构的时候,一般会分成三个section:header.body.footer.如下面这个页面: 这个时候我们就需要对body部分进行最小高度设置,才能避免footer部分出现在页面中间 ...
- jquery-mobile的页面跳转和iscroll之间的兼容解决方法
有一项目需要用到滚动效果,最后选择了iscroll插件,代码写好后chrome测试一切正常(直接查看用到滚动效果的页面以下统称当前页面),运行APP应用一步步跳转到当前页面的时候,滚动效果和滚动条等死 ...
- sql2000新建登陆用户错误“21002:[SQL-DMO] 用户***已经存在”的原因和解决方法【孤立用户解决方法】
错误症状: 在SQL Server200中用附加数据库导入数据后,在新建登录时出现会出现错误21002:[SQL-DMO] 用户***已经存在.然后发现没建成的用户已经在登录列表里了.删除重建,问题依 ...
- sharepoint 2013 office web app 2013 文档在线浏览 IE11 浏览器不兼容解决方法
昨晚配置完成office web apps 2013的外部网络访问之后,今天发现了一个很奇怪的问题,就是IE 11不支持文档在线浏览,找了很多方法,打补丁什么的,都不管用,最后在预览文件的页面,看到& ...
- IScroll5+在ios、android点击(click)事件不兼容解决方法
Bug描述: ios.android4.4+下不能触发click事件. Bug解决: 调用iscroll插件,增加配置参数:click:true/false click的值是要根据移动终端设备进行判断 ...
- 【JavaScript兼容】关于IE8及以下无法通过getElementsByClassName()方法获得元素的解决方法
try{ var a = document.getElementsByClassName("cla"); console.log(a); }catch(ex){ var array ...
随机推荐
- Spring Boot环境下自定义shiro过滤器会过滤所有的url的问题
在配置shiro过滤器时增加了自定义的过滤器,主要是用来处理未登录状态下返回一些信息 //自定义过滤器 Map<String, Filter> filtersMap = new Linke ...
- Eleven puzzle_hdu_3095(双向广搜).java
Eleven puzzle Time Limit: 20000/5000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) T ...
- python 学习定时任务apscheduler模块
最近在解决定时任务问题找到了apscheduler模块,贴一段代码 from apscheduler.schedulers.blocking import BlockingSchedulerimpor ...
- 关于数组中加入相同的view的试验
随便新建一个工程,然后在控制器中粘贴如下代码 - (void)viewDidLoad { [super viewDidLoad]; UIView * view = [[UIView alloc]ini ...
- chrome 浏览器设置字体大小,方便调试
H5开发的时候,有时候明明字体没有那么大,但在chrome中看上去依然很大.就像型号不对一样,但在手机端是正常的. 这是因为chrome浏览器设置了默认字体.只需要设置一下即可. 「chrome:/ ...
- ATITIT.翻译模块的设计与实现 api attilax 总结
ATITIT.翻译模块的设计与实现 api attilax 总结 1. 翻译原理1 2. TMX格式是国际通用格式(xml)1 2.1. 方法/步骤2 3. TRADOS2 4. ATITIT.翻译软 ...
- atitit.javascript js 上传文件的本地预览
atitit.javascript js 上传文件的本地预览 1. .URL.createObjectURL 1 1.1. 吊销所有使用 URL.createObjectURL 而创建的 URL,以 ...
- https证书最佳实战目录
[svc]openssl对称加密,非对称加密最佳实战 http://blog.csdn.net/iiiiher/article/details/78593464 [svc]证书的生成和各个字段的含义 ...
- 通过camera + gallery android上传文件到html
今天做项目的时候遇到一个问题:当html通过js调用input of type file时候,希望android手机的选择器可以同时出现“相机”和“图片”等,但通过下面代码 Intent i = ne ...
- 使用BleLib的轻松搞定Android低功耗蓝牙Ble 4.0开发具体解释
转载请注明来源: http://blog.csdn.net/kjunchen/article/details/50909410 使用BleLib的轻松搞定Android低功耗蓝牙Ble 4.0开发具体 ...