1、代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="jquery-3.1.1.min.js" ></script>
</head>
<body>
<form action="">
<input id="aa" type="checkbox" value="点hahah" test="hah"/>
</form>
<script type="text/javascript">
//.attr修改Value的值并且获取value的值
$("#aa").attr("value","点击");
console.log($("#aa").attr("value"));
//.prop修改Value的值并且获取value的值
$("input").prop("value","6666");
console.log($("input").prop("value"));
//.attr添加indexs并且获取indexs的值
$("input").attr("indexs","66666");
console.log($("input"),attr("indexs"));
//.props添加ha并且获取ha的值
$("input").prop("ha","666667777");
console.log($("input").prop("ha"));
//.attr和.prop分别获取checkbox的状态
console.log($("input").attr("checked"));
//attr不能获取checkbox的默认状态
console.log($("input").prop("checked"));
//获取test
console.log($("input").attr("test"));
console.log($("input").prop("test"));
</script>
</body>
</html>
2、在控制台的显示
3、总结
1.attr和prop都可以添加和获取自己添加的元素,但是prop添加的标签中本身不存在的元素实在标签中找不到的,但是可以通过console.log()输出出来
2.prop可以获取selected和checked等默认属性,attr不行
3.attr可以获取标签本身不存在但是已经在标签中写好的属性比如上面的test而prop不可以