本文主要為大家帶來一篇詳談jQuery中使用attr(), prop(), val()取得value的異同。小編覺得蠻不錯的，現在就分享給大家，也給大家做個參考。一起跟著小編過來看看吧，希望能幫助大家。
jQuery中有3個取得元素value值的函數比較相似：attr(), prop(), val()；拿來比較一下。
範例程式碼：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<script src="jquery-2.1.4.js"></script>
</head>
<body>
<input type="text" value="123"/>
<button id="btn">click</button>
<script>
$("#btn").click(function(){
var attr=$("input").attr("value");
var prop=$("input").prop("value");
var val=$("input").val();
console.log(attr);
console.log(prop);
console.log(val);
})
</script>
</body>程式碼如上所示，為輸入框設定了初始值：123，此時點選按鈕，控制台輸出為：
123 123 123
改變輸入框的值，此時控制台輸出：
123 123thgf 123thgf
如果我們沒有為文字方塊設定初始值，也就是刪除value=”123」後，依舊使用如上js程式碼，則對應輸出如下：
#undefined
attr()輸出為undefined，而prop()和val()輸出為「空」。
輸入value值後：控制台輸出為：
undefined asdasd asdasd
attr()輸出仍為undefined，而prop()和val( )則輸出實際值。
可見，prop()和val()都能取得到文字方塊的實際value值，而attr()取得的則總是為文件結構中的value的屬性值，與文字方塊實際值無關，並不會改變。
相關推薦：
jQuery .attr()和.removeAttr()方法操作元素屬性範例_jquery
以上是jQuery中使用attr(), prop(), val()來取得value的異同詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章！
