jQuery获取
jQuery拥有可操作HTML元素和属性的方法。
获得内容-text()、html()、val()
三个用于DOM操作的jQuery方法：
text()-设置或返回所选元素的文本内容
html()-设置或返回所选元素的内容（包括html标记）
val()-设置或返回表单字段的值
<!DOCTYPE html>
<html>
<head>
<script src="/jquery/jquery-1.11.1.min.js"></script>
<script>
$(document).ready(function(){
$("#btn1").click(function(){
alert("Text: " + $("#test").text());
});
$("#btn2").click(function(){
alert("HTML: " + $("#test").html());
});
});
</script>
</head>
<body>
<p id="test">这是段落中的<b>粗体</b>文本。</p>
<button id="btn1">显示文本</button>
<button id="btn2">显示 HTML</button>
</body>
</html>点击“显示文本”和“显示html”，后者将所选元素中的html标签一起输出，即<b></b>也会被输出。
而val()则用于显示表单中的内容，如：
<input type="text" id="test" value="123">
使用$(#test).val(),会获取表单的值“123”设置内容-text()、html()、val()
$("#btn1").click(function(){
$("#test1").text("Hello world!");
});
$("#btn2").click(function(){
$("#test2").html("<b>Hello world!</b>");
});
$("#btn3").click(function(){
$("#test3").val("Dolly Duck");
});text()、html()、val()的回调函数
上面的三个 jQuery 方法：text()、html() 以及 val()，同样拥有回调函数。回调函数由两个参数：被选元素列表中当前元素的下标，以及原始（旧的）值。然后以函数新值返回您希望使用的字符串。
下面的例子演示带有回调函数的 text() 和 html()：
<!DOCTYPE html>
<html>
<head>
<script src="/jquery/jquery-1.11.1.min.js"></script>
<script>
$(document).ready(function(){
$("#btn1").click(function(){
$("#test1").text(function(i,origText){
return "Old text: " + origText + " New text: Hello world! (index: " + i + ")";
});
});
$("#btn2").click(function(){
$("#test2").html(function(i,origText){
return "Old html: " + origText + " New html: Hello <b>world!</b> (index: " + i + ")";
});
});
});
</script>
</head>
<body>
<p id="test1">这是<b>粗体</b>文本。</p>
<p id="test2">这是另一段<b>粗体</b>文本。</p>
<button id="btn1">显示旧/新文本</button>
<button id="btn2">显示旧/新 HTML</button>
</body>
</html>设置属性-attr()
attr()可以用于设置和改变元素的属性值
比如，改变链接中的href值
$("button").click(function(){
$("#w3s").attr("href","http://www.w3school.com.cn/jquery");
});attr()也可以用于同时设置多个属性
此时属性名和改变值之间逗号应变为冒号，不同属性之间用逗号隔开
$("button").click(function(){
$("#w3s").attr({
"href" : "http://www.w3school.com.cn/jquery",
"title" : "W3School jQuery Tutorial"
});
});attr()也可以有回调函数，同样有两个参数，参数意义同上。然后返回你希望更改的值。
与上述三个函数不同，attr函数的语法为
$(selector).attr("属性名",回调函数);回调函数返回一个值，将其设为新的属性值，并且回掉函数的两个参数是默认将被选元素列表中当前元素的下标，以及原始（旧的）值传入。不受参数名称影响。
扫一扫
1万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
