3.2.8: jQuery的DOM操作之属性操作-优快云博客

本文链接：https://blog.youkuaiyun.com/confirmAname/article/details/17744183

本文介绍了如何使用jQuery进行属性的操作，包括获取属性值、设置属性值以及删除属性等常见任务。通过具体的实例展示了如何利用$.ready()函数确保DOM加载完成后执行脚本，并提供了设置单个属性值、批量设置多个属性值及移除属性的方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1. 获取属性和设置属性attr()：

如果要获取p元素的属性title，只需要给attr()方法传递一个参数，即属性名称：

<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script src="jQuery/jquery-1.10.2.js"></script>
<script type="text/javascript">
	$(document).ready(function(){
		var p_txt=$("p").attr("title");
		alert(p_txt);
	});
</script>
</head>
<body>
<p title="what kind of fruit do you like best?">你最喜欢的水果是?</p>
<ul>
	<li title="apple">苹果</li>
	<li title="orange">橘子</li>
	<li title="banana">香蕉</li>
</ul>
</body>
</html>

如果要设置<p>元素的title属性，还是使用同一个方法，不同的是此时需要传递两个参数，即属性名称和对应的值。

<script type="text/javascript">
	$(document).ready(function(){
		$("p").attr("title","the title of p has changed...");
	});
</script>

如果要一次性为同一个元素设置多个属性，可以：

<script type="text/javascript">
	$(document).ready(function(){
		$("p").attr({"title":"the title of p has changed...","name":"test"});
	});
</script>

2. 删除属性removeAttr()：

<script type="text/javascript">
	$(document).ready(function(){
		$("p").removeAttr("title");
	});
</script>