标签：charset   补充   src   定义   dom   query   int   输入   function   

一、内容操作

1、html()

与JS中的interHTML属性类似，用以读取或者设置某个元素的HTML内容。

    
城市
    
    //获取p元素的HTML内容：城市
    $("p").html()   
    //设置p元素的HTML内容：此时为：
城市
    $("p").html("城市") 

2、text()

与JS中innerText属性类似，用以读取或设置某个元素中的文本内容。

    
城市
        
    //获取p元素的文本内容：城市
    $("p").text()
    //设置p元素的文本内容，此时为：
新城市
    $("p").text("新城市")

3、val()

与JS中的Value属性类似，用以设置和获取元素的value属性值。

    

    //获取input元素的value值：请输入你的名字
    $("input").val()
    //设置input元素的value值，此时为：
    $("input").val("请输入")

需要注意的是，val()还可以用于下拉框，多选框，单选框的选项选择，以下拉框为例：

1
2
31
2
3
//选择2
$("#single_select").val("2");
//同时选择2和3
$("#multiple_select").val(["1","2"]);

二、属性操作

1、获取与设置属性

city

$("#city").attr("title")    //获取该元素的title属性值：this is a city


$("#city").attr("title","new city");    //设置title属性的值为new city
$("#city").attr({                       //设置多组属性值的格式
    "title":"newCity",
    "name":"city"
})                                  

2、删除属性

$("#city").removeAttr("title");     //删除title属性，此时为：
city

三、样式操作

1、追加样式

事先定义指定的class样式，使用addClass操作。

$("#city").addClass("myClass");

2、设置样式

同样可以事先定义class样式，使用attr()设置属性。

$("#city").attr("class","myClass");

3、移除样式

使用removeClass移除class样式，或利用removeAttr移除class属性。

$("#city").removeClass("myClass");  //移除指定值为myClass的class
$("#city").removeAttr("class");     //移除class属性

removeClass（）：括号内不加参数代表删除所有的class属性。

removeClass（"myClass yourClass“）：指定多个属性值时，用空格隔开。

4、切换样式

使用toggleClass方法进行样式切换。

    
        


city
        

5、判断是否含有样式

$("#city").hasClass("myClass")  //如果含有myClass，返回true

四、样式操作CSS补充

利用CSS-DOM，通过设置或读取style属性来操作样式。

1、设置样式

$("#city").css("background","red")  //设置”background“ 为red

$("#city").css(
    {
        "background":"red",
        "width":"500px",
        "fontSize":"50px"   //font-size --> fontSize
    });

2、获取样式

$("#city").css("width")     //获取width 的值

【jQuery】：DOM的属性、内容、样式操作

标签：charset   补充   src   定义   dom   query   int   输入   function   

原文地址：https://www.cnblogs.com/summerday152/p/12401933.html