溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
這篇文章主要介紹“如何用jq獲取input的value值”，在日常操作中，相信很多人在如何用jq獲取input的value值問題上存在疑惑，小編查閱了各式資料，整理出簡單好用的操作方法，希望對大家解答”如何用jq獲取input的value值”的疑惑有所幫助！接下來，請跟著小編一起來學習吧！
在進行內容操作時，對于設置和獲取元素的內容使用同一個函數進行操作，設置元素內容時直接在函數中傳入參數即可。
1. html()
// 獲取mydiv的標簽體內容var divValue = $("#mydiv").html()// 設置mydiv的標簽體內容var divValue = $("#mydiv").html(“你好”)2. text()
// 獲取mydiv文本內容var divText = $("#mydiv").text()// 設置mydiv文本內容var divText = $("#mydiv").text(“你好”)3. val()
// 獲取myinput 的value值var value = $("#myinput").val()// 設置myinput 的value值var value = $("#myinput").val(“你好”)關于上述代碼的實際演示如下：
<!DOCTYPE html><html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="../js/jquery-3.3.1.min.js"></script>
<script>
$(function (){ // 獲取myinput 的value值
var value = $("#myinput").val() // alert(value);
// 獲取mydiv的標簽體內容
var divValue = $("#mydiv").html()
alert(divValue); // 獲取mydiv文本內容
var divText = $("#mydiv").text() // alert(divText)
}); </script>
</head>
<body>
<input id="myinput" type="text" name="username" value="張三" /><br />
<div id="mydiv"><p><a href="#">標題標簽</a></p></div>
</body></html>通用屬性操作
1. attr():
//獲取北京節點的name屬性值var bj = $("#bj").attr("name");
alert(bj);//設置北京節點的name屬性的值為dabeijing$("#bj").attr("name", "dabeijing");//新增北京節點的discription屬性 屬性值是didu$("#bj").attr("discription", "didu");//刪除北京節點的name屬性并檢驗name屬性是否存在2. removeAttr()
//刪除北京節點的name屬性并檢驗name屬性是否存在$("#bj").removeAttr("name");3. prop()
//獲得hobby的的選中狀態var hobby_type = $("#hobby").prop("checkbox");4. removeProp()
//刪除hobby的CheckBox屬性var hobby_type = $("#hobby").removeProp("checkbox");5.attr和prop區別
如果操作的是元素的固有屬性，則建議使用prop
如果操作的是元素自定義的屬性，則建議使用attr
對class屬性操作
1. addClass()
//<input type="button" value=" addClass" id="b2"/>//給one標簽增加屬性$("#b2").click(function () {
$("#one").addClass("second");
});2. removeClass()
//<input type="button" value="removeClass" id="b3"/>//刪除one標簽的class屬性$("#b3").click(function () {
$("#one").removeClass("second");
});3. toggleClass()
//<input type="button" value=" 切換樣式" id="b4"/>//為one標簽的class樣式進行切換，有class屬性就刪除，沒有就添加$("#b4").click(function () {
$("#one").toggleClass("second");
});在這里對該函數做一個詳細的介紹：
如toggleClass(“one”):
* 判斷如果元素對象上存在class=”one”，則將屬性值one刪除掉。 如果元素對象上不存在class=”one”，則添加
4. css()
//<input type="button" value=" 通過css()獲得id為one背景顏色" id="b5"/>$("#b5").click(function () { var backgroundColor = $("#one").css("backgroundColor");
alert(backgroundColor);
});//<input type="button" value=" 通過css()設置id為one背景顏色為綠色" id="b6"/>$("#b6").click(function () {
$("#one").css("backgroundColor","green")
});1. append()
作用：父元素將子元素追加到末尾
樣例：對象1.append(對象2): 將對象2添加到對象1元素內部，并且在末尾
2. prepend()
作用：父元素將子元素追加到開頭
樣例：對象1.prepend(對象2):將對象2添加到對象1元素內部，并且在開頭
3. appendTo()
樣例：對象1.appendTo(對象2):將對象1添加到對象2內部，并且在末尾
4. prependTo()
樣例：對象1.prependTo(對象2):將對象1添加到對象2內部，并且在開頭
5. after()
作用：添加元素到元素后邊
樣例：對象1.after(對象2)： 將對象2添加到對象1后邊。對象1和對象2是兄弟關系
6. before()
作用：添加元素到元素前邊
樣例：對象1.before(對象2)： 將對象2添加到對象1前邊。對象1和對象2是兄弟關系
7. insertAfter()
樣例：對象1.insertAfter(對象2)：將對象1添加到對象2后邊。對象1和對象2是兄弟關系
8. insertBefore()
樣例：對象1.insertBefore(對象2)： 將對象1添加到對象2前邊。對象1和對象2是兄弟關系
9. remove()
作用：移除元素
樣例：對象.remove():將對象刪除掉
10. empty()
作用：清空元素的所有后代元素。
樣例：對象.empty():將對象的后代元素全部清空，但是保留當前對象以及其屬性節點
到此，關于“如何用jq獲取input的value值”的學習就結束了，希望能夠解決大家的疑惑。理論與實踐的搭配能更好的幫助大家學習，快去試試吧！若想繼續學習更多相關知識，請繼續關注億速云網站，小編會繼續努力為大家帶來更多實用的文章！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
