来来来，开篇点题。

分页应用。当在当前页时，分页的数字有个框之类的。

重要代码如下

    <ul class="pagination">

                        <li><a href="#"><i class="fa fa-angle-left"></i></a></li>

                        <li class="active"><a href="#">1</a></li>

                        <li><a href="#">2</a></li>

                        <li><a href="#">3</a></li>

                        <li><a href="#">4</a></li>

                        <li><a href="#"><i class="fa fa-angle-right"></i></a></li>

                    </ul>

好，问题来了：我们是一个一个修改，添加    【class="active"】吗？如果10可以，那么100个呢？

这里只说如何添加class,不说怎么分类哈。

1 方法

重要代码：                        el.setAttribute('class','blablaba'); 

实例代码

<style type="text/css">

.red {

background: red;

}

</style> 

<div id="d1">test div</div>

<script>

var div = document.getElementById('d1');

div.setAttribute("class", "red");

</script> 
问题：IE6/7 : div背景色不是红色 
IE8/9/10/Firefox/Safari/Chrome/Opera : div背景色为红色 
结果：IE6/7不支持setAttribute('class',xxx)方式设置元素的class。 

这个方法不好，那向下看

2.来个几乎万能的way

核心代码：el.className = 'blablabla'; 

<style type="text/css">

.red {

background: red;

}

</style> 

<BODY>

<div id="d1">test div</div>

<script>

var div = document.getElementById('d1');

div.className = 'red';

</script>

利用js添加class的更多相关文章

  1. 利用JS脚本通过getAttribute（）和setAttribute（）等对CSS样式进行操作

    HTML中引入CSS样式的方式有三种: 1.最常用的,引入样式表,在样式表中编写样式,引入方式如下:<link href="css/style.css" rel=" ...

  2. 原生js添加和删除类

    原生js添加和删除类: this.className +=" "; this.className = this.className.replace(" 原来的类" ...

  3. JS 数据类型转换-转换函数、强制类型转换、利用js变量弱类型转换

    1. 转换函数: js提供了parseInt()和parseFloat()两个转换函数.前者把值转换成整数,后者把值转换成浮点数.只有对String类型调用这些方法,这两个函数才能正确运行:对其他类型 ...

  4. JS 添加千分位，测试可以使用

    JS 添加千分位,测试可以使用 <script language="javascript" type="text/javascript">funct ...

  5. 利用js制作html table分页示例(js实现分页)

    有时候table的列数太长,不利于使用者查询,所以利用JS做了一个table的分页,以下为相关代码 一.JS代码 <script type="text/javascript" ...

  6. 利用JS实现闪烁字体

    以下为在JSP文件中,利用JS实现闪烁字体的代码: HTML代码: <div id="blink">一段会闪烁的字</div> JavaScript代码: ...

  7. 利用JS实现HTML TABLE的分页

    有时候table的列数太长,不利于使用者查询,所以利用JS做了一个table的分页,以下为相关代码 一.JS代码 <script type="text/javascript" ...

  8. 利用js闭包获取索引号

    以tab选项卡效果为例: 网页中的选项卡效果

  9. 利用js制作异步验证ajax方法（）

    如何利用js写ajax异步验证.代码如下: window.onload = function(){ var name = document.getElementById('register-name- ...

随机推荐

  1. C# DataTbale详细操作

    1.创建DataTable对象 DataTable dt = new DataTable("Table_AX"); 2.为DataTable创建列 //方式一(我觉得这种好) dt ...

  2. JavaScript通知浏览器，更改通知数目

    http://lab.ejci.net/favico.js/ http://www.zhangxinxu.com/study/201607/web-notifications.html http:// ...

  3. 【BZOJ1004】[HNOI2008]Cards Burnside引理

    [BZOJ1004][HNOI2008]Cards 题意:把$n$张牌染成$a,b,c$,3种颜色.其中颜色为$a,b,c$的牌的数量分别为$sa,sb,sc$.并且给出$m$个置换,保证这$m$个置 ...

  4. INTRO: THE DAWN (亡灵序曲) 中独白

    As the last ship sailed towards the distant horizon I sat there watching on a rock My mind slowly dr ...

  5. 树形DP总结，持续更新

    自己做了动态规划的题目已经有了一个月,但是成效甚微,所以来总结一下动态规划,希望自己能够温故知新.这个博客是关于树形dp的,动态规划的一类题目. 首先从最简单的树形DP入手,树形DP顾名思义就是一棵树 ...

  6. Git：从github上克隆、修改和更新项目

    一.在本地新建一个文件夹,作为本地仓库,如“BigProjet”.在该文件夹打开git bash,进入到该文件夹目录下 二.将本地仓库初始化 $ git init 三.将项目从github或者服务器上 ...

  7. Lost connection to MySQL server during query ([Errno 104] Connection reset by peer)

    Can't connect to MySQL server Lost connection to MySQL server during query · Issue #269 · PyMySQL/Py ...

  8. 蔡勒(Zeller)公式--黑色星期五

    求某年某月某日是周几; 蔡勒(Zeller)公式: w=y+[y/4]+[c/4]-2c+[26(m+1)/10]+d-1 ;y是年的后两位:c是世纪数-1(年的前两位):m是月份,大于等于3,小于等 ...

  9. 洛谷P3368 树状数组2 树状数组+差分

    正解:树状数组+差分 解题报告: 戳我! 不得不说灵巧真滴是越来越弱了...连模板题都要放上来了QAQ 因为今天考试的T3正解要用到树状数组这才惊觉树状数组掌握得太太太太差了...之前一直靠线段树续着 ...

  10. Frame报文

    链路层帧常用的帧格式有两种:Ethernet II   与   IEEE802.3 Ethernet II 格式多用于终端设备的通信 IEEE802.3  格式多用于网络设备的通信 如何区分这两种报文 ...