9、jQuery属性操作的基本使用示例

Sian · 发表于 2016-2-20 19:59:35

[HTML] 纯文本查看 复制代码

<!DOCTYPE html>
<html>
	<head>
		<title>jQuery</title>
		<meta charset="utf-8"/>
		<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
		<script>
			$(document).ready(function(){
				$('button').click(function(){
					// 只有一个参数时获取属性值，两个参数则设置属性值
					// var ret = $(':checkbox').eq(0).attr('value');
					// $(':checkbox').last().attr('value', 'temp');
					// 设置多个属性值
					// $(':checkbox').last().attr({name:'name', value:'value'});
					// 删除属性值，removeAttr会将键值都删除
					// $(':checkbox').eq(1).removeAttr('value');
					// 删除多个属性值(用空格隔开)
					// $(':checkbox').eq(1).removeAttr('name value');
					
					
					/** prop与attr使用及功能极其相似，最明显的区别是获取checked、selected、disabled时
						attr返回undefind或字符串
						prop返回布尔值 **/
					// var ret = $(':checkbox').eq(0).prop('checked');
					// $(':checkbox').last().prop('value', 'temp');
					// 设置多个属性值
					// $(':checkbox').last().prop({name:'name', value:'value'});
					// console.log(ret);
					
					// removeProp与removeAttr同样非常相似
					// $(':checkbox').eq(1).removeProp('value');
					// 删除多个属性值(用空格隔开)
					// $(':checkbox').eq(1).removeProp('name value');
				});
			});
		</script>
	</head>
	<body>
		<span>选择你喜欢的网站</span>
		<div>
			<input type="checkbox" name="site" value="php"/>[url]www.php.com[/url]
			<input type="checkbox" name="site" value="ios"/>[url]www.ios.com[/url]
			<input type="checkbox" name="site" value="zend"/>[url]www.zend.com[/url]
		</div>
		<button>按钮</button>
	</body>
</html>

帐号		自动登录	找回密码
密码			立即注册

[jQuery] 9、jQuery属性操作的基本使用示例