1.内容操作
1.1html():相当于js中的innerHTML,对元素的标签体内容进行设置获取
1.2text():相当于js中的innerText,对元素的标签体内的纯文本内容进行设置获取
1.3val():相当于js中的value(),对元素的value属性进行设置获取
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
td {
text-align: center;
}
button {
width: 100px;
}
</style>
<script type="text/javascript" src="js/jquery-2.2.4.min.js">
</script>
<script type="text/javascript">
function f1(){
$("input:first").val("666");
}
function f2(){
alert($("input:first").val("99999"));
}
</script>
</head>
<body>
<input type="text" />
<hr />
<table height="50px" cellpadding="0" border="1px">
<tr>
<td>
<button onclick="f1()">设置value</button>
</td>
<td>
<button onclick="f2()">获取value</button>
</td>
</tr>
<tr>
<td>
<button onclick="f3()">设置text</button>
</td>
<td>
<button onclick="f4()">获取text</button>
</td>
</tr>
<tr>
<td>
<button onclick="f5()">设置html</button>
</td>
<td>
<button onclick="f6()">获取html</button>
</td>
</tr>
</table>
</body>
</html>
2.样式的操作
css():可以对样式进行设置,也可以通过指定的样式名获取样式值
获取方式:css("样式名")
3.属性操作
3.1 通用的属性操作
3.1.1 prop()
获取、设置元素的属性
3.1.2 removeProp
删除属性
3.1.3 attr()
获取、设置元素的属性
3.1.4 removeAttr()
删除属性
注:
1.prop(参数1,参数2)和attr(参数1,参数2)是对元素进行属性的设置
prop(参数)和attr(参数)是对元素的属性进行获取
2.prop()和attr()都能对元素的固有属性和自定义属性进行设置和获取
3.prop()和qttr()的设置和获取不能穿插使用
4.prop()一般用于对元素的固有属性进行设置和获取
attr()一般用于对元素的自定义属性进行设置和获取
5.removeProp()只能移除自定义的属性
removeAttr()既可以移除自定义的属性也可以移除固有属性
3.2 class属性操作
3.2.1 addClass():
添加class的属性值
3.2.2 removeClass():
删除class的属性值
3.2.3 toggleClass():
切换class的属性
例如:jQuery对象.toggleClass("c")
判断如果元素上有class = "c",则将属性值c删除;
如果没有class = "c",则添加属性值c
4. 元素的追加和删除
4.1 append()
a.append(b):将b元素作为a元素的最后一个子元素,并且追加到末尾
4.2 prepend()
a.prepend(b):将b元素作为a元素的子元素,并且添加在开头
4.3 appendTo()
a.appendTo(b):将a元素作为b元素的子元素,并且追加到末尾
4.4 prependTo()
a.prependTo(b):将a元素作为b元素的子元素,并且追加到末尾
4.5 before()
a.before(b):将b元素放到a元素之前
4.6 after()
a.after(b):将b元素放到a元素之后
4.7 remove():
删除元素
4.8 empty()
删除所有后代元素,保留自身