《
设置class元素的三种方式》文章地址：http://www.tfxk.com/wangyesheji/jianzhanjingyan/030234V12013.htm
--> [
网站建设之]设置class元素的三种方式
列举所有的方法，看看各阅读器的支撑差别。
一、el.setAttribute('class','abc');
01 <!DOCTYPE HTML>
02 <HTML>
03 ,
论打造成功的病毒广告; <,
论好的设计;HEAD>
04 <meta charset="utf-8" />
05 <title>setAttribute('class', 'abc')</title>
06 <style type="text/css">
07 .abc {
08 background: red;
09 }
10 </style>
11 </HEAD>
12 <BODY>
13 <div id="d1">test div</div>
14 <script>
15 var div = document.getElementById('d1');
16 div.setAttribute("class", "abc");
17 </script>
18 </BODY>
19 </HTML>
IE6/7 : div背景色不是红色
IE8/9/10/Firefox/Safari/Chrome/Opera : div背风景为红色
结果：IE6/7不支持setAttribute('class',xxx)方式设置元素的class。
二、el.setAttribute('className', 'abc')
01 <!DOCTYPE HTML>
02 <HTML>
03 <HEAD>
04 <meta charset=",
论坛常用几种防恶意广告方法优劣分析;utf-8" />
05 <title>setAttribute('className', 'abc')</title>
06 <style type="text/css">
07 .abc {
08 background: red;
09 }
10 </style>
11 </HEAD>
12 <BODY>
13 <div id="d1">test div</div>
14 <script>
15 var div = document.getElementById('d1');
16 div.setAttribute("className", "abc");
17 </script>
18 </BODY>
19 </HTML>
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';
01 <!DOCTYPE HTML>
02 <,
论团购网站运营真谛;HTML>
03 <HEAD>
04 <meta charset="utf-8" />
05 <title>el.className = 'abc'</title>
06 <style type="text/css">
07 .abc {
08 background: red;
09 }
10 </style>
11 </HEAD>
12 <BODY>
13 <div id="d1">test div</div>
14 <script>
15 var div = document.getElementById('d1');
16 div.className = 'abc';
17 </script>
18 </BODY>
19 </HTML>
所有浏览器都支持。 Tag：class元素 class元素 ,
论WEB设计;
(责任编辑：网站建设)
设置class元素的三种方式相关文章