專注Java教育14年
全國咨詢/投訴熱線：400-8080-105
更新時間：2021-09-01 10:43:46 來源：動力節(jié)點 瀏覽8775次
您可以簡單地使用 jQueryattr()方法來獲取或設(shè)置元素的ID屬性值。
以下示例將在單擊按鈕時在警報框中顯示DIV元素的ID。
<!DOCTYPE html>
<html lang="en">
<head>
<title>jQuery Get ID of an Element</title>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<style>
div{
padding: 20px;
background: #abb1b8;
}
</style>
<script>
$(document).ready(function(){
$("#myBtn").click(function(){
var elmId = $("#test").attr("id");
alert(elmId);
});
});
</script>
</head>
<body>
<div id="test">#text</div>
<br>
<button type="button" id="myBtn">Show Div ID</button>
</body>
</html>
您還可以通過循環(huán)獲取具有相同類的多個元素的ID，如下所示：
<!DOCTYPE html>
<html lang="en">
<head>
<title>jQuery Get ID of Multiple Elements</title>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<style>
div{
padding: 20px;
margin-bottom: 10px;
background: #abb1b8;
}
</style>
<script>
$(document).ready(function(){
$("#myBtn").click(function(){
var idArr = [];
$(".box").each(function(){
idArr.push($(this).attr("id"));
});
// Join array elements and display in alert
alert(idArr.join(", "));
});
});
</script>
</head>
<body>
<div class="box" id="boxOne">#boxOne</div>
<div class="box" id="boxTwo">#boxTwo</div>
<div class="box" id="boxThree">#boxThree</div>
<button type="button" id="myBtn">Show ID List</button>
</body>
</html>
您還可以在使用基于從 0 開始的索引的類選擇器時獲取單個元素的 ID，例如，您可以使用$(".box").get(0).id或獲取一組匹配元素中的第一個元素的 ID $(".box")[0].id。
類似地，要獲取最后一個元素的 ID，您可以使用類似這樣的東西，$(".box").get($(".box").length - 1).id或者$(".box")[$(".box").length - 1].id，因為 jQuery 選擇器返回匹配元素的集合而不是單個元素。
以上就是動力節(jié)點小編介紹的"使用jQuery獲取元素的ID的方法"，希望對大家有幫助，想了解更多可查看 jQuery教程。動力節(jié)點在線學(xué)習(xí)教程，針對沒有任何Java基礎(chǔ)的讀者學(xué)習(xí),讓你從入門到精通,主要介紹了一些Java基礎(chǔ)的核心知識，讓同學(xué)們更好更方便的學(xué)習(xí)和了解Java編程，感興趣的同學(xué)可以關(guān)注一下。
初級 202925
初級 203221
初級 202629
初級 203743
官方微信
官方抖音
Java實驗班
Java就業(yè)班
Java夜校直播班
Java在職加薪班
Java架構(gòu)師班
京公網(wǎng)安備 11030102010736號