Miten Muokata mitä Tahansa Web-Sivun Chrome (tai Selaimen)

• Chris Hoffman

  @chrisbhoffman

• 2. lokakuuta 2019, 8:00 EDT

Web-sivut ovat vain asiakirjoja, web-selain näyttää. Mutta entä jos voisit kirjoittaa suoraan millä tahansa sivulla muuttaa sitä? Voit, etkä tarvitse selainlaajennusta—se on ominaisuus, joka on rakennettu jokaiseen nykyaikaiseen selaimeen.

Tämä ominaisuus hyödyntää ” – dokumenttia.designMode ” – ominaisuus, jonka voit ottaa käyttöön selaimesi JavaScript-konsolin kautta., Tomek Sułkowski korosti asiaa hiljattain Twitterissä, mutta se on niin siistiä, että se pitää jakaa lukijoillemme.

tämän ominaisuuden avulla voit puhdistaa web-sivun ennen sen tulostamista, testata, miltä muutokset www-sivulle näyttävät tai jopa vain pilailla ihmisiä. Se on aivan kuin muokkaamalla Word document-ei messing HTML tarvitaan.

aktivoi tämä ominaisuus, käy verkkosivulla ja avaa sitten kehittäjäkonsoli., Avaa konsoli Google Chrome, klikkaa menu > uusia Työkaluja > Kehittäjän Työkalut tai paina Ctrl+Shift+i.

Kun käytät Chrome esimerkkinä tästä, tämä ominaisuus toimii muilla selaimilla, liian. Tässä on, miten avata console muissa selaimissa:

• Mozilla Firefox, klikkaa menu > Web-Kehittäjä > Web-Konsolin tai paina Ctrl+Vaihto+K.,
• Apple Safari ja valitse Safari > Asetukset > Lisäasetukset ja ota käyttöön ”Näytä, Kehittää valikko valikkorivillä.”Sitten klikkaa Kehittää > Näytä JavaScript-Konsoli.
• Microsoft Edge, valitse valikko > uusia Työkaluja > Kehittäjän Työkalut tai painamalla F12-näppäintä ja valitse ”Console” – välilehti.

Napsauta ”konsoli” – välilehteä kehittäjän työkalupakin yläosassa., Kirjoita seuraava konsoli ja paina Enter:

document.designMode = 'on'

Voit nyt sulkea konsoli, jos haluat, ja muokata nykyisen web-sivun, ikään kuin se oli muokattava asiakirja. Klikkaa jostain lisätä kohdistin ja kirjoita teksti. Käytä Backspace tai poista avaimet poistaa tekstiä, kuvia, ja muita elementtejä.

Tämä vain muuttaa sitä, miten web-sivu näkyy selaimessasi. Heti kun päivität sivun, näet alkuperäisen jälleen., Jos menet toiselle sivulle tai välilehteen, se ei ole suunnittelutilassa ennen kuin avaat konsolin ja kirjoitat tämän rivin jälleen.

Voit jopa mennä takaisin konsoliin ja suorita seuraava komento kääntää design-tila pois päältä:

document.designMode = 'off'

web-sivua ei voi muokata enää, mutta tekemäsi muutokset säilyvät, kunnes sinun seuraava päivitä sivu.