js中设置元素class的三种方法小结
一、el.setAttribute('class','abc');
代码如下:
.abc {
background: red;
}
test div
var div = document.getElementById('d1');
div.setAttribute("class", "abc");
IE6/7 : div背景色不是红色
IE8/9/10/Firefox/Safari/Chrome/Opera : div背景色为红色
结果:IE6/7不支持setAttribute('class',xxx)方式设置元素的class。
二、el.setAttribute('className', 'abc')
代码如下:
.abc {
background: red;
}
test div
var div = document.getElementById('d1');
div.setAttribute("className", "abc");
IE6/7 : div背景色为红色
IE8/9/10/Firefox/Safari/Chrome/Opera : div背景色不是红色
结果:IE8/9/10/Firefox/Safari/Chrome/Opera不支持setAttribute('className',xxx)方式设置元素的class。
很有趣,使用setAttribute的时候第一个参数为class和className的情形在IE6/7和IE8/9/10/Firefox/Safari/Chrome/Opera刚好相反。
三、el.className = 'abc';
代码如下:
.abc {
background: red;
}
test div
var div = document.getElementById('d1');
div.className = 'abc';
所有浏览器都支持。
原文地址:http://www.shangxueba.com/jingyan/1906397.html
js中设置元素class的三种方法小结的更多相关文章
- JavaScript中设置元素class的三种方法小结
第一.element.setAttribute('class','abc'); 第二.element.setAttribute('className', 'abc') : 第三.element.cl ...
- Android中设置文本颜色的三种方法
最近刚开始学web,发现好的颜色搭配可以让自己的网页更加美观, 中午不想做事,就无聊滴花了两个小时测试了所有颜色的编码,总结如下 新手没有什么吊炸天的技术,仅仅是一份辅助的文档,有兴趣的朋友可以收藏下 ...
- JavaScript进阶(四)js字符串转换成数字的三种方法
js字符串转换成数字的三种方法 在js读取文本框或者其它表单数据的时候获得的值是字符串类型的,例如两个文本框a和b,如果获得a的value值为11,b的value值为9 ,那么a.value要小于b. ...
- Java中获取键盘输入值的三种方法
Java中获取键盘输入值的三种方法 Java程序开发过程中,需要从键盘获取输入值是常有的事,但Java它偏偏就没有像c语言给我们提供的scanf(),C++给我们提供的cin()获取键盘输入值 ...
- 【转载】取得系统中网卡MAC地址的三种方法
From:http://blog.csdn.net/zhangting1987/article/details/2732135 网卡地址这个概念有点混淆不清.因为实际上有两个地址,mac地址和物理地址 ...
- JS变量和变量交换的三种方法
一.what 变量就是用来存储数据的容器 二.how 通过var 关键字定义一个变量 var n1; //定义变量 变量的赋值:通过赋值运算符“=” 给变量赋值. var n2=123; //定义变量 ...
- 两种设置disabled属性以及三种方法移除disabled属性
//两种方法设置disabled属性 $('#areaSelect').attr("disabled",true); $('#areaSelect').attr("dis ...
- JS中date日期初始化的5种方法
创建一个日期对象: 代码如下: var objDate=new Date([arguments list]); 参数形式有以下5种: 1)new Date("month dd,yyyy hh ...
- Postgresql 创建主键并设置自动递增的三种方法
Postgresql 有以下三种方法设置主键递增的方式,下面来看下相同点和不同点. --方法一create table test_a ( id serial, name character var ...
随机推荐
- java使用jsch连接linux
由于项目需要使用java来linux进行管理,近一番查找,发现第三方jar包 jsch 可以轻松实现对linux的管理,(相关文档及例子请访问官网www.jcraft.com),故引进. 在网上搜索了 ...
- Android IOS WebRTC 音视频开发总结(八十一)-- WebRTC靠谱吗?有没有适合的SDK推荐?
作者:blaker,最早发表在我们的微信公众和[编风网],详见[这里] 支持原创,转载必须注明出处,欢迎关注我的微信公众号blacker(微信ID:blackerteam 或 webrtcorgcn) ...
- 通过innobackupex实现对MySQL的增量备份与还原
备份 增量备份是基于完整备份的,所以我们需要先做一次完整备份: innobackupex --password=test /backup/ 备注:test是我的MySQL服务的root用户的密码,/b ...
- iOS图片加载到内存中占用内存情况
我的测试结果: 图片占用内存 图片尺寸 .png文件大小 1MB 512*512 316KB 4MB 10 ...
- 一、MMA概述
一.MMA概述 返回目录页1.MMA的使用2.函数3.表达式4.数值计算和符号计算5.数据的表示6.程序设计-------------------------- ...
- oracle删除users表空间
1.users表空间一般情况下是默认的,需将别的空间设置成默认,再删除users表空间(oracle不允许删除默认空间的). 2.删除表空间的同时会报这样的错:ORA-22868错误.原因:推断应该存 ...
- sga_target大于sga_max_size数据库无法启动
环境:oracle 11g 单机 操作过程:由于修改SGA的大小,只修sga_max_size,没有修改sga_target,改导sga_max_size大于sga_target的大小,使得数据库无法 ...
- VS2010中没有ado.net entity data model实体数据模型这一选项-解决办法
前提先安装VS2010 SP1包. 解决办法: 1.从VS2010的安装盘目录下面的WCU\EFTools找到ADONETEntityFrameworkTools_chs.msi和ADONETEnti ...
- UML大战需求分析阅读笔记2
全面深入理解客户的业务,才能帮助我们准确的把握客户的需要.而在理解客户业务的同时,我们往往需要做业务流程再造(BPR:Business Process Reengineering)的工作.BPR简单说 ...
- android_demo之自动生成动态表格
今天我们学习了如何更好的利用Android 的 layout 布局. 接下来是个简单的栗子去了解这个自动生成的动态的控件(自动生成表格) 这是我们的layout 页面 <?xml version ...