Com es pot editar qualsevol pàgina web a Chrome (o qualsevol navegador)

Les pàgines web són només documents que mostra el navegador web. Però, i si podríeu escriure directament en qualsevol pàgina web per modificar-la? Podeu fer-ho i no necessiteu cap extensió de navegador: és una funció integrada a tots els navegadors moderns.

Aquesta característica aprofita la funció "document.designMode", que podeu habilitar mitjançant la consola JavaScript del navegador web. Va ser destacat recentment per Tomek Sułkowski a Twitter, però és tan genial que ho hem de compartir amb els nostres lectors.

Podeu utilitzar aquesta funció per netejar una pàgina web abans d’imprimir-la, provar l’aspecte dels canvis a una pàgina web o fins i tot fer broma. Serà igual que editar un document de Word; no cal fer cap embolic amb HTML.

Per activar aquesta funció, visiteu una pàgina web i obriu la consola per a desenvolupadors. Per obrir la consola a Google Chrome, feu clic a menú> Més eines> Eines per a desenvolupadors o premeu Ctrl + Maj + i.

Tot i que aquí fem servir Chrome com a exemple, aquesta funció també funciona en altres navegadors moderns. A continuació s’explica com obrir la consola en altres navegadors:

  • A Mozilla Firefox, feu clic a menú> Desenvolupador web> Consola web o premeu Ctrl + Maj + K.
  • A Apple Safari, feu clic a Safari> Preferències> Avançat i activeu "Mostra el menú de desenvolupament a la barra de menú". A continuació, feu clic a Desenvolupa> Mostra la consola de JavaScript.
  • A Microsoft Edge, feu clic a menú> Més eines> Eines per a desenvolupadors o premeu F12 i, a continuació, feu clic a la pestanya "Consola".

Feu clic a la pestanya "Consola" a la part superior del tauler Eines per a desenvolupadors. Escriviu el següent a la consola i premeu Retorn:

document.designMode = "activat"

Ara podeu tancar la consola, si voleu, i editar la pàgina web actual com si fos un document editable. Feu clic en algun lloc per inserir el cursor i escriviu text. Utilitzeu les tecles Retrocés o Suprimeix per eliminar text, imatges i altres elements.

Això només canvia la manera com apareix la pàgina web al vostre navegador. Tan bon punt actualitzeu la pàgina, tornareu a veure l'original. Si aneu a una altra pàgina web o pestanya, no estarà en mode de disseny fins que no obriu la consola i torneu a escriure aquesta línia.

Fins i tot podeu tornar a la consola i executar l'ordre següent per desactivar el mode de disseny:

document.designMode = "desactivat"

La pàgina web ja no es podrà editar, però els canvis es conservaran fins que actualitzeu la pàgina.


$config[zx-auto] not found$config[zx-overlay] not found