在Web程序开发中、很多时候会用需要修改Html标签的class名称、来达到修改标签样式的效果、那么在代码中一般是怎么操作的呢、本文将为你详细讲解一下class的使用、在jQuery中可以使用attr()方法修改”class”属性、也可以用addClass()、removeClass()、toggleClass()、hasClass()以及css()方法来完成
1、javascript addClass
利用document.getElementById("XX")找到document对象、然后再通过addClass("xxx")修改其class值
document.getElementById("XX").addClass("xxx");
2、addClass()
addClass()方法向匹配的元素增加指定的类名(一个或多个)、注意对于元素来说、class属性可以有多个值、该方法不会移除已经存在的值、而是在原有的基础上追加一个或多个class属性
$(".XX").addClass("xxx");
3、removeClass()
removeClass()方法从被选元素移除一个或多个类、如需移除若干类、用空格来分隔类名、如果没有传参数、该方法将会移除被选元素的所有类
$(".XX").removeClass("xxx");
4、toggleClass()
toggleClass()方法对被选元素的一个或多个类进行切换(设置或移除)、该方法检查每个元素中的指定类、如果存在则删除、如果不存在则添加、通过添加参数,可以设置只进行删除或者只进行添加操作、switch值为true时、只添加、为false时、只删除
$(".XX").toggleClass("xxx",switch);
5、hasClass()
hasClass()方法检查被选元素是否包含指定的class、还可以用is()方法实现同样的功能、方法参数传入一个选择器字符串、比如”.className”
$(".XX").hasClass("xxx");
6、css()
读操作:获取匹配元素集合中第一个元素的指定样式值(一个或多个)、读取多个样式值的操作是在jQuery v1.9才加入的
写操作: 为匹配元素集合中的每一个元素设置一个或多个CSS属性的值、传入的参数可以是单个的键值对、也可以是PlainObject指定的多个值
$(".XX").css("color","red");
7、attr()
attr()方法设置或返回被选元素的属性值、根据该方法不同的参数、其工作方式也有所差异
$(".XX").attr("class","xxx");
jQuery会处理各个浏览器中不太相同的一些具体情况、比如W3C的cssFloat在IE中是styleFloat、在jQuery中、你可以使用float、然后jQuery会帮你把它翻译成每个浏览器中应该有的正确名称、还有、jQuery会合理解读CSS和DOM格式的多词属性、比如.css(“background-color”)和.css(“backgroundColor”)、它都是可以处理的
Statement of this Website
The copyright of this blog article belongs to the blogger. Please specify the address when reprinting! If there is any infringement or violation of the law, please contact admin@php.cn Report processing!