jQuery-获取/设置 属性（标准属性，自定义属性）和内容

一、获取/设置内容

• text() -设置或返回元素的文本内容；
• html() -设置或返回元素的内容（包括html标记）；
• val() -设置或返回表单字段的值。

具体例子如下：控制台调试

$("#DcountryName").val(-1);

$("#DcountryName").val();
"-1"

$("#DcountryName").text("xixixi");

$("#DcountryName").text();
"xixixi"

$("#DcountryName").html();
"xixixi"

$("#DcountryName").html("heiheihei");

$("#DcountryName").html();
"heiheihei"

二、获取/设置属性

利用attr()方法获得元素属性值

部分标准属性：以下标签不提供下面的属性：base、head、html、meta、param、script、style 以及 title 元素。

属性	值	描述
class	classname	规定元素的类名（classname）
id	id	规定元素的唯一 id
style	style_definition	规定元素的行内样式（inline style）
title	text	规定元素的额外信息（可在工具提示中显示）

具体例子如下：控制台调试

$("#DprovinceName").attr("class");
"form-control"

自定义属性：用户可以自定义元素特有属性，但是在HTML5之后，规范要求属性以"data-"开头，如data-num；

• attr()获取值 attr属性必须是html标签上，属于dom属性，设置和获取都是操作dom
• data()获取值 data是对象属性，设置和获取都是直接操作dom节点的内存值，不是dom元素，建议用data()取值，不会引起额外的dom操作

具体例子如下：控制台调试

$("#DprovinceName").find("option:selected").attr("data-value");
"140000"

$("#DprovinceName").find("option:selected").attr("data-value","1212121");

$("#DprovinceName").find("option:selected").attr("data-value");
"1212121"

$("#DprovinceName").find("option:selected").attr("data-value");
"1212121"

$("#DprovinceName").find("option:selected").data("value");
1212121

备注：这里面的 "option：selected" 是选中的下拉框，我自己在写这块儿的时候总会忘，直接就用id取值，结果都是undefined，应该有限定，选中的下拉框

 

注：这里还有个需要注意的点是 getattribute()和attr()的区别，二者都是获取元素属性值，前面是js写法，后面是jquery写法，但是二者还是有区别的

• getattribute()  函数主体必须是元素（element）
• attr() 函数主体必须是对象（object）