Làm cách nào để có bộ chọn CSS hoạt động trong Công cụ dành cho nhà phát triển cho Chrome 17?

Question

Dường như cửa sổ tìm kiếm của Công cụ tìm kiếm trong Chrome 17 không còn khớp với công cụ chọn CSS nữa. Boo. Tôi biết tôi có thể sử dụng giao diện điều khiển JS nhưng nó thực sự, thực sự giúp tôi để xem các trận đấu trong bối cảnh của DOM. Nếu bất cứ ai biết làm thế nào tôi vẫn có thể đạt được điều này hoặc cách khác, làm thế nào để trở lại một phiên bản trước đó (tức là tôi đã có ngày hôm qua) của chrome tôi sẽ đánh giá cao nó.

Answer 1

Tôi chưa thể tìm thấy bất kỳ giải pháp nào để có bộ chọn CSS hoạt động lại trên thanh tìm kiếm.Rejoice, for they have returned!

Trong mọi trường hợp, bạn vẫn có thể sử dụng document.querySelectorAll() với một chọn trong giao diện điều khiển JS, sau đó nhấp chuột phải vào bất kỳ các yếu tố phù hợp và chọn Reveal trong Elements Bảng điều chỉnh và nó sẽ cho bạn thấy nó ở đâu trong DOM, giống như các phiên bản trước.

Answer 2

Đây là một hồi quy không mong muốn trong Chrome mà chúng tôi không nắm bắt được. May mắn Ariel (trong các ý kiến ​​ở đây) filed a ticket và nó đã được cố định hai ngày sau đó.

Nếu mọi việc suôn sẻ, nó sẽ đi tới kênh ổn định sau khoảng 11 tuần. Tuy nhiên, tính năng hiện khả dụng trong Chrome Canary, vì vậy, tôi khuyên bạn nên sử dụng tính năng đó.

Answer 3

Một cách khác là sử dụng $$ trong giao diện điều khiển, ví dụ:

$$("#contents ul.features") 

Answer 4

tôi xác minh Css và XPath selectors sử dụng Natu WebSync extension for Chrome.

Nó có thể:

• chia selector đến các bộ phận và xác minh chúng riêng
• hiển thị với màu sắc bao nhiêu yếu tố được tìm thấy cho mỗi phần selector. 0 - đỏ, 1 - Màu xanh lá cây, một số - Vàng
• yếu tố nổi bật trên trang khi tôi lơ lửng phần selector
• điều hướng để chọn thành phần trong tab Elements khi tôi nhấp vào phần chọn

Nó có thể rất hữu ích cho những ai cần viết và xác minh các bộ chọn phức tạp.

https://chrome.google.com/webstore/detail/natu-websync/aohpgnblncapofbobbilnlfliihianac