<html>
<head>
<title>jquery操作属性</title>
<meta charset="UTF-8"/>
<!--
jquery操作属性:
获取元素对象
操作属性
获取属性
元素对象名.attr("属性名")//返回当前属性的值。但是value的值获取的是默认值
元素对象名.val()//返回value属性的实时的值
修改属性
元素对象名.attr("属性名","新的属性值");
-->
<!--引入jQuery文件-->
<script src="js/jquery-1.9.1.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
//获取属性
function getField(){
//获取元素对象
var inp=$("#uname");
//获取属性
alert(inp.attr("type")+":"+inp.attr("name")+":"+inp.attr("id")+":"+inp.attr("value"));
alert(inp.val());
}
//修改元素属性
function operField(){
//获取元素对象
var inp=$("#uname");
//修改属性
inp.attr("type","button");
}
//用户名校验
function checkUname(){
//获取用户名信息
var uname=$("#uname").val();
//校验
//声明校验规则 [\u4e00-\u9fa5]{2,4}
var reg=/^[\u4e00-\u9fa5]{2,4}$/;
//开始校验
if(uname==""){
alert("用户名不能为空");
}else if(reg.test(uname)){
alert("用户名OK");
}else{
alert("用户名不符合规则");
}
}
</script>
</head>
<body>
<h3>jquery操作属性</h3>
<input type="button" id="" value="测试获取属性" onclick="getField()" />
<input type="button" id="" value="测试修改属性" onclick="operField()" />
<hr />
用户名: <input type="text" name="uname" id="uname" value="" onblur="checkUname()"/>
</body>
</html>