Chỉnh sửa mã nguồn HTML bằng Google Chrome

34

Trong Internet Explorer, tôi có thể mở tệp .html cục bộ và chỉnh sửa tệp bằng cách chọn "Nguồn" trong menu "Xem", "thực hiện thay đổi nhanh và sau đó" Làm mới "(tải lại) trang web.

Làm cách nào tôi có thể làm điều đó với Google Chrome?

Tôi có thể mở tệp .html trong Windows Notepad không? (Tôi thích notepad vì nó rất nhanh.)

— barlop
nguồn

27

Ctrl+Shift+I or F12-> Các yếu tố, Nó sẽ hiển thị nguồn của bạn. Nhấp chuột phải vào bất kỳ yếu tố nào và nhấpEdit as HTML

Chỉnh sửa:

Có một số tiện ích mở rộng trông giống như những gì bạn muốn: https://chrom.google.com.vn/extensions/search?itemlang=&q=editor

ChromeEditor& Live WebSite Editortrông đầy hứa hẹn.

Được thêm bởi barlop
Tôi thấy rằng (sau ctrl-shift-I / F12), nhấp chuột phải vào <HTML..> or </HTML>thẻ và nhấp vào "chỉnh sửa dưới dạng html". cho phép tôi chỉnh sửa bất cứ nơi nào trong đó. Chọn thẻ mở có nghĩa là cửa sổ bật lên để chỉnh sửa chỉ bao gồm tất cả các nguồn html có ở đó - rất gọn về không gian khi chỉnh sửa. Chọn thẻ đóng có thể hữu ích vì cửa sổ bật lên sẽ xuất hiện dưới html để bạn thấy trước / sau. Hoặc tốt hơn, như benjamin nói, F2 để chỉnh sửa, ctrl-enter để cam kết.

— Bộ giải mã thông thường
nguồn

1

thử nhấp chính xác vào tên thẻ chẳng hạn<body>

— thường

1

Đây là công cụ gỡ lỗi. Nó không phải là công cụ chỉnh sửa. Để tạo các trang sử dụng một cái gì đó như Aptana, Netbeans hoặc IDE khác phù hợp hơn. Với việc hoàn thành thẻ, tham chiếu, hoàn thành javascript, v.v. Đây là cách hiệu quả hơn nhiều để tạo các trang web. Nếu bạn khăng khăng sử dụng Chrome Developer Tools làm trình chỉnh sửa html của mình thì có copy as htmltùy chọn menu ngữ cảnh. Vì vậy, bạn có thể dán nó trở lại trình soạn thảo văn bản chính của bạn hoặc công cụ khác.

— thường

1

Gần nhất với những gì bạn đang nói về điều mà tôi biết, đó là addon Fireorms trong Firefox. Trong số nhiều công cụ gỡ lỗi javascript / css / dom, nó cung cấp cho bạn trong menu ngữ cảnh trên một Open with Editortùy chọn trang . Bạn có thể thêm một số biên tập viên. Tất nhiên bạn có thể cấu hình nó để sử dụng Notepad.

— thường

2

nhanh hơn một chút khi sử dụng F2 để chỉnh sửa và Ctrl + Enter để cam kết

— Benjamin

1

F2 và F2 lại thực hiện công việc tương tự như Ctrl + Enter.

— Frank Nocke

23

mở DevTools.
bảng điều khiển mở.
chọn html hoặc phần thân hoặc phần tử khác mà bạn muốn.
mở giao diện điều khiển bởi Esc.
viết $ 0.contentEditable = true

bây giờ bạn có thể chỉnh sửa văn bản trên trang và di chuyển hình ảnh nhưng không phải là bạn thực sự muốn :)

— loislo
nguồn

4

không thực sự là những gì tôi muốn, nhưng đó là một tính năng rất thú vị!

— barlop

Tôi có đúng là mặc định này được bật trong các phiên bản Chrome hiện tại không? Ý tôi là, tôi đã có thể chỉnh sửa trong tab Elements.

— Alex

Tôi chỉ cho bạn 100 điểm sử dụng tính năng này.

— Benjamin

Tính năng thực sự tuyệt vời

— iroel

@Benjamin Bạn có nghiêm túc về +100 (tức là bạn đã cho anh ấy thêm phiếu trong bản sao địa phương của bạn rõ ràng sẽ không có ảnh hưởng đến trang web nhưng vẫn vậy), điều đó sẽ rất thú vị .. Bạn đã làm điều đó như thế nào? hoặc bạn đang làm một trò đùa rất xấu và gây hiểu lầm?

— barlop

1

Bạn có thể thử InlineEditor này để chỉnh sửa và lưu html tĩnh trong các trang trình duyệt ở đây là bản demo

— MKK
nguồn

1

Nếu bạn muốn chỉnh sửa tệp dưới dạng nguồn html (chứ không phải các thành phần riêng lẻ), bạn có thể thực hiện các thao tác sau:

chọn tab 'Nguồn' ở bên trái
nhấp chuột phải vào ngăn 'Nguồn' và chọn 'Thêm thư mục vào vùng làm việc' và thêm thư mục với tệp HTML nguồn
nhấp chuột phải vào tệp html bạn muốn chỉnh sửa và chọn 'ánh xạ tới tài nguyên mạng'

— Paul Troon
nguồn

Đây là cách chính xác để phát triển trong trình duyệt

— sidonaldson