В этой статье мы увидим, как получить идентификатор элемента с помощью jquery. Использование метода jquery attr() для получения или установки значения атрибута id элемента. Метод attr() устанавливает или возвращает значения атрибутов выбранных элементов.
Итак, давайте посмотрим, как получить идентификатор щелкнутого элемента jquery, jquery получить идентификатор элемента, установить идентификатор элемента jquery, метод attr в jquery, как получить идентификатор элемента в javascript, получить идентификатор элемента при нажатии jquery, установить значение атрибута jquery.
В следующем примере идентификатор элемента DIV будет отображаться в окне предупреждения при нажатии кнопки.
<!DOCTYPE html>
<html lang="en">
<head>
<title>How To Get The ID Of An Element Using jQuery - Websolutionstuff</title>
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<style>
div{
padding: 20px;
background: #abb1b8;
}
</style>
<script>
$(document).ready(function(){
$("#btnID").click(function(){
var elmId = $("#divID").attr("id");
alert(elmId);
});
});
</script>
</head>
<body>
<div id="divID">#text</div><br>
<button type="button" id="btnID">Show Div ID</button>
</body>
</html>
Читайте также: Как изменить название месяца в jQuery Datepicker
Вы также можете получить идентификатор нескольких элементов, имеющих один и тот же класс, через цикл, например.
<!DOCTYPE html>
<html lang="en">
<head>
<title>How To Get The ID Of An Element Using jQuery - Websolutionstuff</title>
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<style>
div{
padding: 20px;
margin-bottom: 10px;
background: #abb1b8;
}
</style>
<script>
$(document).ready(function(){
$("#btnID").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="divIDOne">#boxOne</div>
<div class="box" id="divIDTwo">#boxTwo</div>
<div class="box" id="divIDThree">#boxThree</div>
<button type="button" id="btnID">Show ID List</button>
</body>
</html>
Вам также может понравиться:
- Читайте также: Таблицы данных динамически отображают и скрывают столбцы в jQuery
- Читайте также: Как отключить кнопку отправки после нажатия с помощью jQuery
- Читайте также: Пример Jquery Append And Prepend
- Читайте также: Как очистить данные формы с помощью jQuery