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

jQuery中有3個獲取元素value值的函數(shù)比較相似：attr(), prop(), val()；拿來比較一下。　

創(chuàng)新互聯(lián)公司2013年至今，是專業(yè)互聯(lián)網(wǎng)技術(shù)服務公司，擁有項目成都做網(wǎng)站、網(wǎng)站建設網(wǎng)站策劃，項目實施與項目整合能力。我們以讓每一個夢想脫穎而出為使命，1280元類烏齊做網(wǎng)站,已為上家服務,為類烏齊各地企業(yè)和個人服務,聯(lián)系電話:028-86922220

示例代碼：

<!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()獲取的則始終為文檔結(jié)構(gòu)中的value的屬性值，與文本框?qū)嶋H值無關(guān)，并不會變化。

以上這篇詳談jQuery中使用attr(), prop(), val()獲取value的異同就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持創(chuàng)新互聯(lián)。

網(wǎng)頁名稱：詳談jQuery中使用attr(),prop(),val()獲取value的異同
當前路徑：http://chinadenli.net/article6/gsjoig.html

成都網(wǎng)站建設公司_創(chuàng)新互聯(lián)，為您提供外貿(mào)網(wǎng)站建設、網(wǎng)站改版、網(wǎng)站設計公司、云服務器、電子商務、App設計

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源：創(chuàng)新互聯(lián)

猜你還喜歡下面的內(nèi)容

欧美一区二区三区老妇人-欧美做爰猛烈大尺度电-99久久夜色精品国产亚洲a-亚洲福利视频一区二区

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