<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<script src="jquery-1.11.1.js"></script>
<script>
//---------------------------获取标签中的属性值 并赋值-----------------------------------------------
jQuery(document).ready(function () {
//val(); 获取标签中的value属性的值。带有参数是赋值(类比js中的value属性)
//打印获取的内容
alert($("input").val());
//给获取的属性赋值
$("input").val("我是刚刚赋值的input内容")
//text(); 获取双闭合标签中的文本值。(不识别标签)(类比innerText)
alert($("div").text());
$("div").text("<li>我是text赋值的</li>")
//html(); 获取双闭合标签中的文本值。(识别标签)(类比innerHTML)
alert($("div").html());
$("div").html("<li>我是html赋值的</li>")
//-------------------------获取宽度width 和 高度height------------------------------------------------
//获取宽度
$("button").eq(0).click(function () {
//换个offsetHeiht不一样。只获取高度
alert($(".box").width());
})
//获取宽度
$("button").eq(1).click(function () {
//设置宽度
$(".box").width(200);
})
//获取高度
$("button").eq(2).click(function () {
//换个offsetHeiht不一样。只获取高度
alert($(".box").height());
})
//获取高度
$("button").eq(3).click(function () {
//设置高度
$(".box").height(200);
})
});
</script>
</head>
<body>
<input type="text" value="我是input"/>
<div>
<li>你好</li>
</div>
<button>获取宽度</button>
<button>设置宽度</button>
<button>获取高度</button>
<button>设置高度</button>
<div class="box"></div>
</body>
</html>
jquery获取标签中的属性值 并且赋值
最新推荐文章于 2024-06-19 19:53:31 发布