Thứ tự của một lớp trên bộ chọn có quan trọng không? Nếu có, tôi có thể chỉ định thứ tự không?

Question

Có một sự khác biệt giữa:

<span id="test" class="one two"></span> 

và

<span id="test" class="two one"></span> 

Nếu có mâu thuẫn quy tắc CSS trên các lớp hiện các vấn đề trật tự?

Có bất kỳ API nào trong jQuery sắp xếp lại không? Khi tôi gọi số addClass(), nó có luôn luôn kết thúc không?

Answer 1

Đơn đặt hàng không quan trọng.

http://jsfiddle.net/rc8Yu/

css precedence

Phần quan trọng ở đây là

Nếu hai nguyên tắc bình đẳng trong tất cả những điều trên, là chiến thắng cuối cùng tuyên bố. CSS nhúng trong html luôn đến sau stylesheets bên ngoài không phụ thuộc vào trật tự trong html

Answer 2

Thứ tự của các lớp trong HTML không không quan trọng, nhưng thứ tự bên trong CSS không thành vấn đề. Ví dụ, nếu bạn có:

span.one { color: red } 
span.two { color: blue } 

Cả hai kéo dài với class="one two" và class="two one" sẽ tạo ra văn bản màu xanh, bởi vì lớp "hai" được định nghĩa trước. Nhưng nếu chúng tôi thay đổi điều đó thành

span.two { color: blue } 
span.one { color: red } 

và thực hiện tương tự, cả hai nhịp bây giờ sẽ có văn bản màu đỏ vì lớp "một" được xác định cuối cùng. Cũng nên nhớ rằng ID sẽ ghi đè lên cả những lớp học không có vấn đề gì, vì vậy nếu tôi đã xác định:

span#test { color: green } 

và thêm id="test", thì nhịp sẽ luôn luôn có văn bản màu xanh lá cây bất cứ đâu trong tài liệu các lớp và Bộ chọn ID được định nghĩa, bởi vì một ID tự nhiên cụ thể hơn một lớp (các trường hợp khác có thể làm cho một lớp cụ thể hơn một ID, v.v.).

---

Vì điều này là đúng, thứ tự các lớp học của bạn như được chỉ định bởi jQuery hoàn toàn không liên quan. Bạn không cần phải lo lắng về việc sắp xếp lại chúng, nhưng có, addClass không chỉ thêm lớp vào cuối danh sách.

Answer 3

Nếu sử dụng thuộc tính DOM classList, thì thứ tự là đáng kể.

Đối tượng được trả lại có các lớp được đặt làm thuộc tính số; thứ tự tăng dần như tên lớp từ trái sang phải.

jsFiddle.