jquery 属性&CSS操作 笔记

一、属性

1、.val([value])

这是一个读写双用的方法,用来处理input的value,当方法没有参数的时候返回input的value值,当传递了一个参数的时候,方法修改input的value值为参数值

$('input').val()

$('input').val('newValue');

2、.attr()

  1. 获取元素特定属性的值
var title = $( "em" ).attr( "class" )//返回的是class的值
$('.child').attr('class') //"child"

2.为元素属性赋值

$('.child').attr('class','hhhh')

多个属性同时设置

$('.child').attr({
'id':'hz',
'value':'big'})

3、.removeAttr()

为匹配的元素集合中的每个元素中移除一个属性(attribute)

.removeAttr() 方法使用原生的 JavaScript removeAttribute() 函数,但是它的优点是可以直接在一个 jQuery 对象上调用该方法,并且它解决了跨浏览器的属性名不同的问题。

$('div').removeAttr('id');

二、CSS相关

1、.css()

  1. 获取元素style特定属性的值
var color = $( this ).css( "background-color" );

var styleProps = $( this ).css([
  "width",
  "height",
  "color",
  "background-color"
]);
  1. 设置元素style特定css属性的值
$( this ).css( "width", "+=200" );

$( this ).css( "background-color", "yellow" );

$( this ).css({
  "background-color": "yellow",
  "font-weight": "bolder"
});

2、.addClass(className) / .removeClass(className)

为元素添加class,不是覆盖原class,是追加,也不会检查重复

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') //true

5、.toggleClass(className)

toggle是切换的意思,方法用于切换。有这个class,就去掉,没有这个class,就加上

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

扫码关注云+社区

领取腾讯云代金券