jQuery之attr属性操作

1)获取id为img的这个元素的src属性的值

<script type="text/javascript" src="js/jquery-2.1.0.js"></script>
<script type="text/javascript">
	$(function(){
		alert($("#img").attr("src"))
	})
</script>

<body>
		<img alt="" id="img" src="images/1.jpg">
</body>

在这里插入图片描述
并得到图片在这里插入图片描述
2)设置id为img的这个元素的src属性的值,实现图片的切换

<script type="text/javascript" src="js/jquery-2.1.0.js"></script>
<script type="text/javascript">
	$(function(){
		alert("切换图片")
		//设置id为img的这个元素的src属性的值,实现图片的切换
		$("#img").attr("src","images/2.jpg")
	})
</script>

3)查看和修改文本框的内容

<script type="text/javascript" src="js/jquery-2.1.0.js"></script>
<script type="text/javascript">
	$(function(){
		//查看文本框选定属性内容·
		$("#name").attr("value")
		alert("修改文本框选定属性的内容")
		$("#name").attr("value","李四")
	})
</script>
<body>
	<input type="text" id="name" value="张三">
</body>

4).val()只能获取表单元素的value,而.attr()可以获取任意元素的value,不管这个元素是否可以使用value这个属性 也可以获取任意属性的值

<script type="text/javascript" src="js/jquery-2.1.0.js"></script>
<script type="text/javascript">
	$(function(){
		//.val()只能获取表单元素的value
		alert($("#a").val())
		//.attr()可以获取任意元素的value,不管这个元素是否可以使用value这个属性 也可以获取任意属性的值
		alert($("#a").attr("value"))
	})
</script>
<a value="哈哈哈" id="a">heiheihei</a>
发布了14 篇原创文章 · 获赞 16 · 访问量 306

猜你喜欢

转载自blog.csdn.net/qq_41490938/article/details/104909810