Làm thế nào để kiểm tra sự bình đẳng DOM với jQuery?

Question

Tôi đang xây dựng một danh sách đơn giản và một trong các mục trong danh sách được chọn. Tôi đang hoàn thành điều này bằng cách sử dụng lớp "đã chọn" được áp dụng cho bất kỳ mục nào tôi muốn chọn. Tôi có hai nút đi về phía trước và phía sau để duyệt qua danh sách này. Tuy nhiên, khi người dùng đến phần tử đầu tiên hoặc phần tử cuối cùng trong danh sách, tôi muốn đăng lại. Đây là nơi tôi đang mắc kẹt, bởi vì tôi đang gặp khó khăn khi xác định rằng mục hiện được chọn không phải là mục đầu tiên hoặc cuối cùng.

Ví dụ đơn giản:

<div id="list"> 
    <p>item 1</p> 
    <p>item 2</p> 
    <p class="selected">item 3</p> 
</div> 

Hãy nói rằng người dùng nhấn vào nút bên cạnh, vào thời điểm này tôi đang kiểm tra cho một cái gì đó tương tự như sau:

if (jQuery('#list p.selected') == jQuery('#list p:last-child')) 
    //do post back 

Tuy nhiên, logic này được trả về false , khiến tôi tin rằng tôi đang tiến gần đến con đường sai lầm này.

Cách tốt nhất để tôi kiểm tra loại logic này bằng jQuery là gì?

Answer 1

Mặc dù bạn có thể so sánh đối tượng jquery như Matt đã cho thấy, hoặc chỉ đơn giản với chỉ số điều hành

if($("#list p.selected")[0] == $("#list p:last-child")[0])... 

này hiếm khi cần thiết với jQuery. Có is một cách tốt hơn!

if($("#list p.selected").is(":last-child")).... 

hoặc theo chiều ngược lại, dễ đọc hơn

if($("#list p:last-child").is(".selected")).... 

Answer 2

jQuery là một đối tượng, vì vậy bạn đang so sánh về mặt kỹ thuật hai đối tượng khác nhau (nhưng tương tự), sẽ luôn là sai.

Hãy thử:

if (jQuery('#list p.selected').get(0) == jQuery('#list p:last-child').get(0)) 

jQuery.get()