重庆分公司,新征程启航
为企业提供网站建设、域名注册、服务器等服务
纯js:
创新互联专业IDC数据服务器托管提供商,专业提供成都服务器托管,服务器租用,达州电信机房,达州电信机房,成都多线服务器托管等服务器托管服务。
document.getElementById('theDom').className='newClass';//替换成一个新class
document.getElementById('theDom').className+=' appendClass';//追加一个class
//用新class替换旧class
document.getElementById('theDom').className=
document.getElementById('theDom').className.replace('oldClass','newClass');
jQuery:
$('#theDom').attr('className','newClass');//替换成一个新class
$('#theDom').attr('className',$('#theDom').attr('className')+'appendClass');
$('#theDom').addClass('appendClass');//等同于纯js的第二句和上一句
$('#theDom').removeClass('oldClass')..addClass('newClass');//删除旧class加入新class
jQuery中 获取与设置样式 获取class和设置class都可以使用attr()方法来完成。例如使用attr()方法来获取p元素的class
var p_class = $("p").attr("class"); //获取p元素的class
使用attr()方法来设置p元素的class,JQuery代码如下:
$("p").attr("'class", "high"); //设置p元素的class为 "high"
判断是否含有某个样式 hasClass()可以用来判断元素中是甭含有某个class,如果有,则返回true,否则返回false。例如可以使用下面的代码来判断theDom
元素中是否含有“another”的class:
$("#theDom").hasClass("another");
document.getElementById('theDom').className.indexOf('another');//纯js方式
更换class可以使用toggleClass方法。
除了这个方法外,还可以先移除一个class在增加新的class。可以根据实际需要选择合适的方法。
需要准备的材料分别有:电脑、html编辑器、浏览器。
1、首先,打开html编辑器,新建html文件,例如:index.html,并引入jquery。
2、在index.html中的script标签,输入jquery代码:$('input').css('width', '250px');。
3、浏览器运行index.html页面,此时输入框的css样式的宽度被成功设置250px。
jQuery中一般有3个关于改变元素class的函数
addClass、removeClass、toggleClass
addClass
描述: 为每个匹配的元素添加指定的样式类名
$('div').addClass('className');//为所有div添加名为className的class
removeClass
描述: 移除集合中每个匹配元素上一个,多个或全部样式。
$('div').removeClass('className');//将所有div上名为className的class移除
toggleClass
描述: 在匹配的元素集合中的每个元素上添加或删除一个或多个样式类,取决于这个样式类是否存在或值切换属性。即:如果存在(不存在)就删除(添加)一个类。
$('div').toggleClass('className');//如果div上有这个class就删除,没有就添加
jquery对象有removeClass(".样式名")和addClass(".样式名")函数,可以移除样式和添加样式。
如果想直接修改样式属性,可以用css()方法。比如$("#名字")css("background","black")
jquery比较简单,通过移除与添加class来操作:
$(".classnameA").removeClass("classnameA").addClass("classnameB");
js直接把classname属性替换即可。
var classAElements = document.getElementsByClassName("classnameA");
//getElementsByClassName获取为数组,则用循环来修改
for(var a in classAElements){
classAElements[a].classname = classAElements[a].classname.replace("classnameA", "classnameB");
}