背景:通过JQuery动态给Html元素增加、删除类或属性,使Html元素在不同的时刻呈现不同的样式,给用户更好的体验感觉。

如存在以下p片段和button按钮,代码如下:

         <p id="pDisplay">现在的背景颜色是白色,点击按钮以后背景变为红色</p>
<button id="changeColor">更改颜色</button>

存在如下css代码:

     <style>
.colorRed{
background-color:red;
}
</style>

存在如下JS代码:

        $("#changeColor").toggle(function () {
$("#pDisplay").addClass("colorRed");
},
function () {
$("#pDisplay").removeClass("colorRed");
});

如上代码,当点击按钮以后,给$("#pDisplay")元素添加或移除css类colorRed,效果如下:

同理,可应用于attr()和removeAttr(),代码如下:

 //Disabled 设置元素不可用:

 $(this).attr("disabled","disabled")

 //移除push元素的diasble特性:

 $("#push").removeAttr('disabled')

JQuery给元素动态增删类或特性的更多相关文章

  1. Jquery 页面元素动态添加后绑定事件丢失方法,非 live

    代码1: 以此方法绑定的input框事件,在通过add按钮后用jquery绑定的事件 alert就会丢失 <input type="button" value="A ...

  2. 用JQuery动态为选中元素添加/删除类

    在做一些tab页功能时,我们经常会见到如下样式: 即当选中一个元素时,在此元素下会添加相应的类,以示区别.今天就研究了一下如何用JQuery实现此效果. 1. HTML代码 <a id=&quo ...

  3. (Jquery)关于给动态加载的页面元素,绑定事件

    如果使用Jquery给元素绑定事件,一般会用bind,或者类似click函数来直接绑定. 但是对于动态生成的元素,会发现常规绑定无法生效,比如: <div class'div'></ ...

  4. jQuery on()绑定动态元素出现的问题小结

    jQuery on()方法是官方推荐的绑定事件的一个方法.使用 on() 方法可以给将来动态创建的动态元素绑定指定的事件,通过本文给大家介绍jQuery on()绑定动态元素出现的问题小结,需要的朋友 ...

  5. jquery无法为动态生成的元素添加点击事件的解决方法

    遇到 jquery无法为动态生成的元素添加点击事件,谷歌一下,整理一下解决方法如下: (<li>中间的元素是动态生成的), 现在想为<i>添加点击事件, 例子如下: <d ...

  6. 页面滚动图片等元素动态加载插件jquery.scrollLoading.js

    如果一个网页很长,那么该页面的加载时间也会相应的较长.而这里给大家介绍的这个jQuery插件scrollLoading的作用则是,对页面元素进行动态加载,通俗的说就是滚到哪就加载到哪,屏幕以下看不见的 ...

  7. jQuery 学习03——HTML:捕获、设置、添加元素、删除元素、CSS类、CSS()方法、尺寸

    jQuery - 获取内容text().html() 以及 val()和属性attr() jQuery 中非常重要的部分,就是操作 DOM 的能力. DOM = Document Object Mod ...

  8. jquery利用appendTo动态创建元素

    动态创建元素可以说是DOM中常做的事情,下面我来介绍在jquery中利用appendTo来动态创建元素,有需要的朋友可参考参考. 当HTML字符串是没有属性的元素是, 内部使用document.cre ...

  9. js进阶---12-11、jquery如何给动态创建出来的元素绑定事件

    js进阶---12-11.jquery如何给动态创建出来的元素绑定事件 一.总结 一句话总结:通过事件委托的方式,通过on方法 1.on方法在事件绑定的时候,data方式带额外参数时,字符串参数和其它 ...

随机推荐

  1. linux下使用svn创建版本库和权限管理

    linux上的svn服务端如何和本地的电脑客户端结合使用 Linux上安装SVN服务器: 第一步:检查是否已安装 # rpm -qa subversion 第二步: 通过yum命令安装svnserve ...

  2. Linux文件和目录的777、755、644权限解释

    Linux文件和目录的权限 1.文件权限 在linux系统中,文件或目录的权限可以分为3种: r:4 读 w:2 写 x:1  执行(运行)-:对应数值0 数字 4 .2 和 1表示读.写.执行权限 ...

  3. 解题报告:poj 3259 Wormholes(入门spfa判断负环)

    Description While exploring his many farms, Farmer John has discovered a number of amazing wormholes ...

  4. 1-6static关键字

    static的作用? static可以修饰变量,被static修饰的变量叫做静态变量,程序运行时静态变量存放在方法区里面,因此,静态变量在类加载阶段赋值,并且只赋值一次.请看例1 static可以修饰 ...

  5. 维骨力Glucosamine的最关键的几点...

    1.每日劑量應為多少?長期服用安全嗎? 由於葡萄糖胺(Glucosamine)和軟骨素(Chondroitin)原來就存在於人體,是人體每天會生產製造的必需營養素,因此,一般認為服用此類產品的安全性相 ...

  6. SecureCRT的配色方法

    配色后效果如下: 下面开始配色 1.首先配置成默认模式 2.终端(Terminal)==>仿真(Emulation) 按图中标注进行勾选,勾选完毕点击确认 2.选项(Options)==> ...

  7. 启动azkaban时出现User xml file conf/azkaban-users.xml doesn't exist问题解决(图文详解)

      问题详情 [hadoop@master azkaban]$ ll total drwxrwxr-x hadoop hadoop May : azkaban- drwxrwxr-x hadoop h ...

  8. Python读取文件行数不对

    对于一个大文件,读取每一个行然后处理,用readline()方法老是读不全,会读到一半就结束,也不报错: 总之处理的行数跟 wc -l 统计的不一样,调试了一下午,改用 with open('xxx. ...

  9. MySQL优化步骤和my.cnf优化配置

    1.查看机器配置,指三大件:cpu.内存.硬盘 2.查看mysql配置参数 3.查看mysql运行状态,可以用mysqlreport工具来查看 4.查看mysql的慢查询 依次解决了以上问题之后,再来 ...

  10. windows下常用的一些shell命令

    看的视频上都是linux系统的shell命令,和windows区别很多.所以整理了windows常用的一些shell命令. 注意:并不是每个都试验过,使用时还需自己验证下. 学system和os,su ...