Các tính năng dành cho nhà phát triển web mới của Firefox, kết hợp với các tiện ích bổ sung dành cho nhà phát triển web tuyệt vời như Firebug và Thanh công cụ dành cho nhà phát triển web, giúp Firefox trở thành trình duyệt lý tưởng cho nhà phát triển web. Tất cả các công cụ đều có sẵn trong Nhà phát triển web trong trình đơn của Firefox.
Trình kiểm tra trang
Kiểm tra một phần tử cụ thể bằng cách nhấp chuột phải vào phần tử đó và chọn Thanh tra (hoặc nhấn Q). Bạn cũng có thể khởi chạy Thanh tra từ trình đơn Nhà phát triển web.
Nếu bạn muốn chọn một phần tử mới, hãy nhấp vào Thanh tra trên thanh công cụ, di chuột qua trang và nhấp vào phần tử của bạn. Firefox làm nổi bật phần tử bên dưới con trỏ của bạn.
Trình kiểm tra HTML
Nhấn vào HTML để xem mã HTML của phần tử hiện được chọn.
Trình kiểm tra HTML cho phép bạn mở rộng và thu gọn các thẻ HTML, giúp dễ dàng hình dung ngay lập tức. Nếu bạn muốn xem HTML của trang trong một tệp phẳng, bạn có thể chọn Xem nguồn trang từ trình đơn Nhà phát triển web.
Trình kiểm tra CSS
Nhấn vào Phong cách để xem các quy tắc CSS được áp dụng cho phần tử đã chọn.
Ngoài ra còn có bảng thuộc tính CSS - chuyển đổi giữa hai bảng bằng cách nhấp vào Quy tắc và Tính chất nút. Để giúp bạn tìm các thuộc tính cụ thể, bảng thuộc tính bao gồm hộp tìm kiếm.
Bạn có thể chỉnh sửa CSS của phần tử khi di chuyển từ bảng Quy tắc. Bỏ chọn bất kỳ hộp kiểm nào để hủy kích hoạt quy tắc, nhấp vào văn bản để thay đổi quy tắc hoặc thêm quy tắc của riêng bạn vào phần tử ở đầu ngăn. Ở đây, tôi đã thêm font-weight: bold; Quy tắc CSS, làm cho văn bản của phần tử được in đậm.
Bàn phím JavaScript
Scratchpad cũng đã thấy bản cập nhật với Firefox 10 và giờ đây có chứa đánh dấu cú pháp. Bạn có thể nhập mã JavaScript để chạy trên trang hiện tại.
Khi bạn đã có, hãy nhấp vào Thi hành menu và chọn Chạy. Mã chạy trong tab hiện tại.
Bảng điều khiển Web
Bảng điều khiển Web thay thế Bảng điều khiển lỗi cũ đã bị ngừng sử dụng và sẽ bị xóa trong phiên bản Firefox trong tương lai.
Thông điệp của nhà phát triển web là gì? Đó là một thông điệp được in ra đối tượng window.console. Ví dụ: chúng tôi có thể chạy window.console.log (“Hello World”); Mã JavaScript trong Scratchpad để in thông báo của nhà phát triển lên bảng điều khiển. Các nhà phát triển web có thể tích hợp các thông điệp này vào mã JavaScript của họ để giúp gỡ lỗi.
Tính đến Firefox 10, Bảng điều khiển Web có thể hoạt động song song với Trình kiểm tra trang. Biến $ 0 đại diện cho đối tượng được chọn hiện tại trong thanh tra. Vì vậy, ví dụ: nếu bạn muốn ẩn đối tượng hiện được chọn, bạn có thể chạy $ 0.style.display =”none” trong bảng điều khiển.
Tải thêm công cụ
Các Tải thêm công cụ tùy chọn sẽ đưa bạn đến bộ sưu tập tiện ích Hộp công cụ của nhà phát triển web trên trang web Add-On của Mozilla. Nó chứa một số tiện ích bổ sung tốt nhất cho các nhà phát triển web, bao gồm Firebug và Thanh công cụ dành cho nhà phát triển web.
Nếu bạn đã sử dụng Firefox trong vài năm, bạn có thể nhớ Trình kiểm tra DOM. Các công cụ phát triển tích hợp của Firefox đã đi một chặng đường dài kể từ đó.
