Slik Redigerer du en Web-Side i Chrome (eller annen Nettleser)

• Chris Hoffman

  @chrisbhoffman

• oktober 2, 2019, 8:00 am EDT

Web-sider er bare dokumenter nettleseren din viser. Men hva om du kunne skrive direkte på en web-side for å endre det? Du kan, og du trenger ikke en nettleserutvidelse—det er en funksjon som er innebygd i alle moderne nettleser.

Denne funksjonen tar nytte av «dokument.designMode» – funksjon, som du kan aktivere via din web-browser JavaScript-konsollen., Det ble nylig markert med Tomek Sułkowski på Twitter, men det er så kult at vi er nødt til å dele den med våre lesere.

Du kan bruke denne funksjonen til å rydde opp i en webside før du skriver det ut, teste hvordan endringer til en web-side skal se ut, eller bare prank folk. Det vil være akkurat som å redigere et Word—dokument uten å rote med HTML nødvendig.

for Å aktivere denne funksjonen, kan du besøke en webside, og deretter åpne den utviklerkonsollen., For å åpne konsollen i Google Chrome, klikker du på meny > Mer Verktøy > utviklerverktøy eller trykk på Ctrl+Shift+i.

Mens vi bruker Chrome som et eksempel her, denne funksjonen fungerer i moderne nettlesere, også. Her er hvordan du kan åpne konsollen i andre nettlesere:

• I Mozilla Firefox, klikk på meny > Web Developer > Web-Konsoll, eller trykk på Ctrl+Shift+K.,
• I Apple Safari, klikker du på Safari > Innstillinger > Avansert og aktivere «Vis Utvikle-menyen i menylinjen.»Klikk, klikk Utvikle > Vis JavaScript-Konsollen.
• I Microsoft Kant, klikker du på meny > Mer Verktøy > utviklerverktøy eller trykk på F12 og klikk deretter på «Konsoll» – fanen.

Klikk på «Konsoll» – fanen på toppen av Verktøy for utviklere-panelet., Skriv inn følgende i konsollen, og trykk Enter:

document.designMode = 'on'

Du kan nå lukke konsollen, hvis du liker, og rediger gjeldende web-side som om det var et redigerbart dokument. Klikk et sted å sett markøren og type tekst. Bruke Rettetasten eller Delete tastene for å fjerne tekst, bilder og andre elementer.

Dette er bare endringer i hvordan web-siden vises i nettleseren din. Så snart du oppdatere siden, vil du se den originale igjen., Hvis du går til en annen web-side eller fane, det vil ikke være i design-modus inntil du åpne konsollen og skriv inn denne linjen igjen.

Du kan til og med gå tilbake til konsollen, og kjør følgende kommando for å slå design-modus:

document.designMode = 'off'

web-siden vil ikke være redigerbare lenger, men endringene vil bli bevart, inntil du oppdatere siden.