JQuery phát hiện xem thẻ có tự đóng không

Question

Có cách nào để phát hiện xem thẻ có tự đóng với JQuery như thẻ hình ảnh không? Cái gì đó năng động không chỉ là một thẻ hình ảnh.

if ($('.selector')[0].tagName.toLowerCase()=="img") { 
    // do something 
} 

Answer 1

Bạn có cần phân biệt giữa yếu tố trống và tự đóng không? Nếu không, bạn có thể sử dụng:

if ($(".selector").is(":empty")) { 
    // do something 
} 

Nhưng nếu bạn đang nói về việc phát hiện liệu một thẻ HTML cho nên trống rỗng hay không, không bạn không thể làm điều đó lập trình bởi vì bạn đang không ngừng tạo ra không hợp lệ HTML và bạn cần phải xác thực nó với DTD để tìm hiểu.

Answer 2

jQuery sử dụng danh sách này trong nội bộ:

/^(?:area|br|col|embed|hr|img|input|link|meta|param)$/i 

Bạn có thể làm tương tự:

if(/^(?:area|br|col|embed|hr|img|input|link|meta|param)$/i.test($('.selector')[0].tagName)) { 
//do something 
} 

Answer 3

Bạn có thể kiểm tra .html() accessor để xem nếu nó trả về một chuỗi rỗng. Mặc dù điều này sẽ trở lại đúng trên <p></p> nhưng tôi muốn hình ảnh cho tất cả các ý định và mục đích có thể được coi là một thẻ tự đóng.

Answer 4

Bạn cần một nền tảng nhỏ. Đánh dấu HTML được gửi qua dây được phân tích bởi trình duyệt thành cây DOM. Tại thời điểm đó, đánh dấu ban đầu đã biến mất, phục vụ mục đích của nó và không còn tồn tại nữa. Khi bạn thực hiện innerHTML trên một phần tử, đó không phải là HTML theo ngữ cảnh đã tạo ra phần tử đó, nhưng tuần tự hóa của trình duyệt đó là subtree DOM.

Vấn đề là không có khác biệt giữa <div /> và <div></div>. Vì vậy, chỉ cần xem nếu nó có bất kỳ trẻ em. Nếu không, phần tử sẽ có biểu diễn XHTML có thể sử dụng thẻ tự đóng.

element.children().length == 0 

hoặc như cletus nói:

element.is(":empty")