jquery 属性&CSS操作 笔记
jquery 属性&CSS操作 笔记
bamboo
发布于 2019-01-29 15:53:45
发布于 2019-01-29 15:53:45
一、属性
1、.val([value])
这是一个读写双用的方法，用来处理input的value，当方法没有参数的时候返回input的value值，当传递了一个参数的时候，方法修改input的value值为参数值
$('input').val()
$('input').val('newValue');
clipboard.png
2、.attr()
- 获取元素特定属性的值
var title = $( "em" ).attr( "class" )//返回的是class的值
$('.child').attr('class') //"child"2.为元素属性赋值
$('.child').attr('class','hhhh')多个属性同时设置
$('.child').attr({
'id':'hz',
'value':'big'})
clipboard.png
3、.removeAttr()
为匹配的元素集合中的每个元素中移除一个属性（attribute）
.removeAttr() 方法使用原生的 JavaScript removeAttribute() 函数,但是它的优点是可以直接在一个 jQuery 对象上调用该方法，并且它解决了跨浏览器的属性名不同的问题。
$('div').removeAttr('id');二、CSS相关
1、.css()
- 获取元素style特定属性的值
var color = $( this ).css( "background-color" );
var styleProps = $( this ).css([
"width",
"height",
"color",
"background-color"
]);
clipboard.png
- 设置元素style特定css属性的值
$( this ).css( "width", "+=200" );
$( this ).css( "background-color", "yellow" );
$( this ).css({
"background-color": "yellow",
"font-weight": "bolder"
});
clipboard.png
2、.addClass(className) / .removeClass(className)
为元素添加class，不是覆盖原class，是追加，也不会检查重复
clipboard.png
3、removeClass([className]) / ,removeClass(function(index,class))
移除元素单个/多个/所有class
$( "p" ).removeClass( "myClass yourClass" );
$( "li:last" ).removeClass(function() {
return $( this ).prev().attr( "class" );
});4、.hasClass(className)
检查元素是否包含某个class，返回true/false
$('.child').hasClass('child') //true5、.toggleClass(className)
toggle是切换的意思，方法用于切换。有这个class，就去掉，没有这个class，就加上
本文参与 腾讯云自媒体分享计划，分享自作者个人站点/博客。
原始发表：2018-12-11，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读
目录