value属性的操作
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="../jquery-1.12.1.js"></script>
<script>
$(function () {
$("#btn").click(function () {
console.log($("#tt2").val());
console.log($("#tt2").text());
$("#tt2").val("雏菊");
$("#tt2").text("雏菊");
});
$("#btn").click(function () {
$("#s1").val(5);
});
});
</script>
</head>
<body>
<input type="button" value="点击" id="btn"/>
<br/>
<input type="radio" value="1" name="sex"/>男
<input type="radio" value="2" name="sex" id="r2"/>女
<input type="radio" value="3" name="sex"/>保密
<br/>
<input type="checkbox" value="1" />吃饭
<input type="checkbox" value="2" />睡觉
<input type="checkbox" value="3" id="ck3"/>打豆豆
<input type="checkbox" value="4" />打铅球
<br/>
<textarea name="tt" id="tt2" cols="30" rows="10">
太真的，太假的，太残忍的话
</textarea>
<br/>
<select id="s1">
<option value="1">妲己</option>
<option value="2">王昭君</option>
<option value="3">西施</option>
<option value="4">貂蝉</option>
<option value="5">小乔</option>
<option value="6">大乔</option>
<option value="7">武则天</option>
</select>
</body>
</html>
自定义属性的操作
-
- .attr(参数1,参数2);---->设置某个属性的值
- .attr(参数1);---->获取某个属性的值
- .removeAttr(“属性”);移除自定义属性
- 参数1:属性的名字
- 参数2:属性的值
- 他可以操作元素自定义的属性，也可以操作元素自带的属性
- 操作元素选中的checked的时候，推荐使用prop方法
元素的选中问题[attr()]
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="../jquery-1.12.1.js"></script>
<script>
$(function () {
$("#btn").click(function () {
$("#r3").attr("checked",false);
console.log($("#r3").attr("checked"));
});
});
</script>
</head>
<body>
<input type="button" value="选中" id="btn"/><br/>
请选择您的性别:
<input type="radio" value="1" name="sex"/>男
<input type="radio" value="2" name="sex"/>女
<input type="radio" value="3" name="sex" id="r3"/>保密
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="../jquery-1.12.1.js"></script>
<script>
$(function () {
$("#btn").click(function () {
$("#uu>li:first").attr("score",100);
$("#a").attr("href","http://www.baidu.com");
console.log($("#a").attr("href"));
});
});
</script>
</head>
<body>
<input type="button" value="点击" id="btn"/>
<br/>
<a id="a">百度</a>
<ul id="uu">
<li>小白</li>
<li>小黑</li>
<li>小红</li>
<li>小绿</li>
</ul>
</body>
</html>
元素选中问题[prop()]
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="../jquery-1.12.1.js"></script>
<script>
$(function () {
$("#btn").click(function () {
if($("#ck").prop("checked")){
$("#ck").prop("checked",false)
}else{
$("#ck").prop("checked",true)
}
});
});
</script>
</head>
<body>
<input type="button" value="选中/不选中" id="btn"/>
<input type="checkbox" value="1" name="play" id="ck" />吃好吃的
</body>
</html>