学习不止眼前的教程与笔记 还需实践与创新

搜索

首页>>网站建设>>jQuery>>基础教程

jQuery DOM 操作之获取与设置css属性

发布时间:2021-08-08 点击:0

    在jQuery中想要设置和获取css的属性值是很方便的,而且方法有很多,大致如下:

    • addClass() - 向被选元素添加一个或多个类
    • removeClass() - 从被选元素删除一个或多个类
    • toggleClass() - 对被选元素进行添加/删除类的切换操作
    • css() - 设置或返回样式属性

    一、用jQuery的addClass()方法向被选元素添加一个或多个类

    使用语法如下:

    $("选择器1,选择器2...选择器n").addClass("样式1 样式2... 样式n");
    其中选择器可以同时设置多个或者一同都行,后面的样式名也是,可以同时设置一个或者多个,但是需要注意的是分隔符。

    实例如下:

    $("p").addClass("css1");

    二、用jQuery的removeClass()方法从被选元素删除一个或多个类

    $("选择器1,选择器2...选择器n").removeClass("样式1 样式2... 样式n");
    使用语法刚好与addClass()相反,它可以同时设置被选元素删除一个或多个类。

    三、用jQuery的toggleClass()方法对被选元素进行添加/删除类的切换操作

    $("选择器").toggleClass("需要添加或者删除的样式名");

    toggleClass()方法可以看成是addClass()与remove()两个方法的结合体,它可以动态的切换添加与删除的状态。

    四、用jQuery的css()方法设置或返回css样式属性

    使用方法如下:

    //获取css属性值
    $("选择器").css("需要获取的属性名");
    //设置css属性值
    $("选择器").css("需要设置的属性名","需要设置的属性值");
    实例如下:

    //获取css属性值
    $("p").css("background-color");
    //设置css属性值
    $("p").css("background-color","red");
赞一个(0)     踩一个(0)    

相关链接