HTML kaynak kodunu Google Chrome ile düzenleme

34

Internet Explorer'da yerel bir .html dosyasını açabilir ve "Görünüm" menüsünde "Kaynak" ı seçerek düzenleyebilir, hızlı bir değişiklik yapabilir ve ardından web sayfasını "Yenile" (yeniden yükle).

Bunu Google Chrome ile nasıl yapabilirim?

.Html dosyasını Windows Not Defteri'nde açabilir miyim? (Not defterini seviyorum çünkü gerçekten hızlı.)

— barlop
kaynak

27

Ctrl+Shift+I or F12-> Elementler, Kaynağınızı göstermelidir. Herhangi bir öğeye sağ tıklayın ve tıklayınEdit as HTML

Düzenle:

İstediğiniz gibi görünen bazı uzantılar var: https://chrome.google.com/extensions/search?itemlang=&q=editor

ChromeEditor& Live WebSite Editorumut verici görünüyorsun.

Barlop tarafından eklenmiştir
(ctrl-shift-I / F12'den sonra), <HTML..> or </HTML>etiketi sağ tıklayıp "html olarak düzenle" yi görüyorum . içinde herhangi bir yeri düzenlememe izin veriyor. Açılış etiketini seçmek, düzenleme için açılan pencerenin yalnızca orada bulunan tüm html kaynağını kapsadığını gösterir - düzenleme yaparken alan açısından çok temizdir. Kapatma etiketini seçmek, açılır pencerenin html altında göründüğü için faydalı olabilir, bu yüzden önce / sonra görebilirsiniz. Veya daha iyisi, Benjamin’in dediği gibi F2’nin düzenleyeceği, ctrl-enter’in giriştiği şekilde

— Günlük Kodlayıcı
kaynak

1

örneğin etiketin adını tam olarak tıklamayı deneyin<body>

— Casual Coder

1

Bu hata ayıklama aracıdır. Bu düzenleme aracı değil. Sayfa oluşturmak için Aptana, Netbeans veya başka bir uygun IDE gibi bir şey kullanın. Etiket tamamlama, başvuru, javascript tamamlama vb. Bu web sayfaları oluşturmak için çok daha verimli bir yoldur. Chrome Geliştirici Araçları'nı html düzenleyiciniz olarak kullanmakta ısrar ediyorsanız, copy as htmlbağlam menüsü seçeneği vardır. Böylece, seçtiğiniz ana metin editörünüze veya başka bir araca yapıştırabilirsiniz.

— Günlük Kodlayıcı

1

Bahsettiğim şeye en yakınım, Firefox'taki Firebug addon. Bir çok javascript / css / dom hata ayıklama aracı arasında, bir sayfa Open with Editorseçeneğinin bağlam menüsünde yer almaktadır . Birkaç editör ekleyebilirsiniz. Tabii ki Not Defteri kullanmak için yapılandırabilirsiniz.

— Günlük Kodlayıcı

2

düzenlemek için F2 ve yapmak için Ctrl + Enter tuşlarına basmak biraz daha hızlı

— Benjamin

1

F2 ve F2 yine Ctrl + Enter ile aynı işi yapar.

— Frank Nocke

23

DevTools'u açın.
Öğeler panelini açın.
Html veya vücut veya istediğiniz başka bir öğe seçin.
Esc tarafından konsolu açın.
$ 0.contentEditable = true yazın

Şimdi sayfadaki metni düzenleyebilir ve görüntüleri taşıyabilirsiniz, ancak gerçekten istediğiniz değil :)

— loislo
kaynak

4

İstediğim tam olarak değil, ama bu çok eğlenceli bir özellik!

— barlop

Geçerli Chrome sürümlerinde varsayılan olarak açık olması doğru muyum? Yani, zaten Öğeler sekmesinde düzenleme yapabilirim.

— Alex,

Bu özelliği kullanarak size sadece +100 verdim.

— Benjamin

Gerçekten şaşırtıcı özellik

— 1913

@Benjamin +100 konusunda ciddi misiniz (yani, yerel kopyanızda fazladan oy kullandınız mı, tabii ki sitenin kendisinde bir etkisi olmayacak ama yine de), bu ilginç olurdu .. Bunu nasıl yaptınız? Yoksa çok kötü ve yanıltıcı bir şaka mı yapıyordun?

— barlop

1

Statik HTML'yi düzenlemek ve kaydetmek için bu InlineEditor'ü deneyebilirsiniz, burada tarayıcı sayfalarında demo

— MKK
kaynak

1

Dosyayı html kaynağı (tek tek öğeleri değil) olarak düzenlemek istiyorsanız, aşağıdakileri yapabilirsiniz:

sol taraftaki 'Kaynaklar' sekmesini seçin
'Kaynaklar' bölmesinde sağ tıklayın ve 'Çalışma alanına klasör ekle' seçeneğini seçin ve kaynak HTML dosyası ile klasör ekleyin
Düzenlemek istediğiniz html dosyasını sağ tıklayın ve 'ağ kaynağına eşle' seçeneğini seçin

— Paul Troon
kaynak

Bu tarayıcıda geliştirmek için doğru bir yoldur

— sidonaldson