jQuery Xác định xem một lớp phù hợp có một id đã cho hay không

JQuery có id tương đương với câu lệnh sau là gì?

$('#mydiv').hasClass('foo')

vì vậy bạn có thể đặt tên lớp và kiểm tra xem nó có chứa id được cung cấp hay không.

cái gì đó như:

$('.mydiv').hasId('foo')

Bạn có thể đưa logic đó vào bộ chọn bằng cách kết hợp nhiều bộ chọn . Ví dụ: chúng ta có thể nhắm mục tiêu tất cả các phần tử với một id đã cho, cũng có một lớp cụ thể:

$("#foo.bar"); // Matches <div id="foo" class="bar">

Điều này sẽ trông giống như một cái gì đó bạn viết trong CSS. Lưu ý rằng nó sẽ không áp dụng cho tất cả các #foophần tử (mặc dù chỉ nên có một) và nó sẽ không áp dụng cho tất cả các .barphần tử (mặc dù có thể có nhiều). Nó sẽ chỉ tham chiếu các phần tử đủ điều kiện trên cả hai thuộc tính.

jQuery cũng có một .isphương pháp tuyệt vời cho phép bạn xác định xem một phần tử có những phẩm chất nhất định hay không. Bạn có thể kiểm tra tập hợp jQuery dựa trên bộ chọn chuỗi, Phần tử HTML hoặc đối tượng jQuery khác. Trong trường hợp này, chúng tôi sẽ chỉ kiểm tra nó với một bộ chọn chuỗi:

$(".bar:first").is("#foo"); // TRUE if first '.bar' in document is also '#foo'

Tôi có thể sẽ sử dụng $('.mydiv').is('#foo');Điều đó đã nói nếu bạn biết Id tại sao bạn sẽ không áp dụng nó cho bộ chọn ngay từ đầu?

cập nhật: xin lỗi đã hiểu nhầm câu hỏi, .has()câu trả lời đã bị xóa .

một cách thay thế khác, tạo .hasId()plugin

// the plugin
$.fn.hasId = function(id) {
  return this.attr('id') == id;
};

// select first class
$('.mydiv').hasId('foo') ?
  console.log('yes') : console.log('no');

// select second class
// $('.mydiv').eq(1).hasId('foo')
// or
$('.mydiv:eq(1)').hasId('foo') ?
  console.log('yes') : console.log('no');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="mydiv" id="foo"></div>
<div class="mydiv"></div>

Giả sử bạn đang lặp lại một số đối tượng DOM và bạn muốn tìm và bắt một phần tử có ID nhất định

<div id="myDiv">
    <div id="fo"><div>
    <div id="bar"><div>
</div>

Bạn có thể viết một cái gì đó như để tìm

$('#myDiv').find('#bar')

Lưu ý rằng nếu bạn sử dụng bộ chọn lớp, phương thức find sẽ trả về tất cả các phần tử phù hợp.

hoặc bạn có thể viết một hàm lặp lại sẽ thực hiện công việc nâng cao hơn

<div id="myDiv">
    <div id="fo"><div>
    <div id="bar"><div>
    <div id="fo1"><div>
    <div id="bar1"><div>
    <div id="fo2"><div>
    <div id="bar2"><div>
</div>

$('#myDiv div').each(function() {
   if($(this).attr('id') == 'bar1')
       //do something with bar1
});

Có thể dễ dàng sửa đổi cùng một mã cho bộ chọn lớp.

<div id="myDiv">
    <div class="fo"><div>
    <div class="bar"><div>
    <div class="fo"><div>
    <div class="bar"><div>
    <div class="fo"><div>
    <div class="bar"><div>
</div>

$('#myDiv div').each(function() {
   if($(this).hasClass('bar'))
       //do something with bar
});

Tôi rất vui vì bạn đã giải quyết được vấn đề của mình với index (), công cụ từng phù hợp với bạn. Tôi hy vọng điều này sẽ giúp những người khác có cùng vấn đề. Chúc mừng :)

$('#' + theMysteryId + '.someClass').each(function() { /* do stuff */ });

Chỉ cần nói rằng cuối cùng tôi đã giải quyết vấn đề này bằng cách sử dụng index ().

KHÔNG CÓ GÌ khác dường như hoạt động.

Vì vậy, đối với các phần tử anh em, đây là một công việc tốt nếu bạn đang chọn một lớp chung trước tiên và sau đó muốn sửa đổi một cái gì đó khác nhau cho từng lớp cụ thể.

CHỈNH SỬA: đối với những người không biết (như tôi) index () đưa ra giá trị chỉ mục cho mỗi phần tử khớp với bộ chọn, tính từ 0, tùy thuộc vào thứ tự của chúng trong DOM. Miễn là bạn biết có bao nhiêu phần tử với class = "foo", bạn không cần id.

Rõ ràng điều này không phải lúc nào cũng hữu ích, nhưng ai đó có thể thấy nó hữu ích.

Kiểm tra xem ID của phần tử có tồn tại không

if ($('#id').attr('id') == 'id')
{
  //OK
}

Bạn cũng có thể kiểm tra xem phần tử id có được sử dụng hay không bằng cách làm như vậy:

if(typeof $(.div).attr('id') == undefined){
   //element has no id
} else {
   //element has id selector
}

Tôi sử dụng phương pháp này cho các Bảng dữ liệu toàn cầu và Bảng dữ liệu được sắp xếp cụ thể