jq基础6——属性

taojYang

于 2019-06-12 15:28:26 发布

阅读量134

点赞数

分类专栏： jquery 文章标签： jquery

本文链接：https://blog.csdn.net/weixin_43293451/article/details/91537768

版权

jquery 专栏收录该内容

10 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>jquery</title>
</head>
<body>
	<script src="jquery.min.js"></script>
	<script type="text/javascript">
		$(function(){
			$("#b1").click(function(){
				alert("align属性是："+$("#d").attr("align"));//获取属性值
			});
			$("#b2").click(function(){
				alert("game属性是："+$("#d").attr("game"));//获取自定义属性
			});
			$("#b3").click(function(){
				$("#d").attr("align","right");//修改属性值
			});
			$("#b4").click(function(){
				$("#d").removeAttr("align");//删除属性值
			});
			$("#b5").click(function(){
				alert("game属性是："+$("#d").attr("game"));
			});
			$("#b6").click(function(){
				alert("game属性是："+$("#d").prop("game"));//undefined
			});
			$("#b7").click(function(){
				alert("checked属性是："+$("#cb").attr("checked"));//返回checked，只获取初始值
			});
			$("#b8").click(function(){
				alert("checked的属性是："+$("#cb").prop("checked"));
				//返回true,false,能够返回变化后的值
			});

		});
	</script>	
	<button id="b1">获取align属性</button><br>
	<button id="b2">获取自定义属性</button><br>
	<button id="b3">修改align属性为right</button><br>
	<button id="b4">删除align属性</button><br>
	<button id="b5">通过attr获取自定义属性值</button>
	<button id="b6">通过prop获取自定义属性值</button>
	<button id="b7">通过attr获取checked属性</button>
	<button id="b8">通过prop获取checked属性</button>
	<div id="d" align="center" game="dota">居中的字段</div>
	<input id="cb" type="checkbox" checked="checked">选中的复选框
</body>
</html>