Cách làm cho một trang có thể chỉnh sửa trong trình duyệt

Có một chế độ đặc biệt và khá bí mật trong các trình duyệt, được gọi là chế độ thiết kế.

Có một chế độ đặc biệt và khá bí mật trong các trình duyệt, được gọi làchế độ thiết kế.

Khi bạn đặt một trang ở chế độ thiết kế, bạn có thể chỉnh sửa nội dung của trang ngay bên trong trang trình duyệt, điều này rất tiện lợi để kiểm tra một số nguyên mẫu hoặc kiểm tra xem tiêu đề mới trông như thế nào, chẳng hạn.

Làm thế nào để bạn kích hoạt nó? MởBảng điều khiển DevToolsvà nhập:

document.designMode = 'on'

Kết quả tương tự có thể được kích hoạt bằng cách bậtcontentEditabletrênbodyphần tử, như thế này:

document.body.contentEditable = true

Bạn có thể chỉnh sửa văn bản, xóa nó và cũng có thể kéo hình ảnh xung quanh để định vị lại chúng.

designMode in action

Bạn có thể tắt chế độ bằng cách sử dụng

document.designMode = 'off'

Tính năng này được hỗ trợ bởi hầu hết mọi trình duyệt, bao gồm cả IE. Nó khá cũ, nhưng khá ít người biết đến.

Tải xuống miễn phí của tôiSổ tay dành cho Người mới bắt đầu JavaScript


Các hướng dẫn khác về trình duyệt: