jQuery中使用attr(), prop(), val()來取得value的異同詳解-js教程-PHP中文網

jQuery中使用attr(), prop(), val()來取得value的異同詳解

小云云

發布： 2018-01-17 11:26:30

原創

1890 人瀏覽過

本文主要為大家帶來一篇詳談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，此時點選按鈕，控制台輸出為：