欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

詳談jQuery中使用attr(), prop(), val()獲取value的異同

 更新時間：2017年04月25日 11:13:18   投稿：jingxian  
下面小編就為大家?guī)硪黄斦刯Query中使用attr(), prop(), val()獲取value的異同。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧

jQuery中有3個獲取元素value值的函數(shù)比較相似：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(), prop(), val()獲取value的異同就是小編分享給大家的全部內容了，希望能給大家一個參考，也希望大家多多支持腳本之家。

相關文章

最新評論