31 maart 2011

Safari: De inhoud van een webpagina aanpassen

1 min leestijd

Met behulp van het optionele ‘ontwikkel’ menu in Safari is het mogelijk om een aantal interessante opties te activeren zoals webinfo, foutconsole, snippereditor en extensiebouwer. Naast al deze vrij technische functies kun je er ook een leuk trucje mee uitvoeren, zoals bijvoorbeeld de tekstinhoud van een webpagina wijzigen.

Activeer allereerst het ontwikkel menu via de voorkeuren van de Safari:

Safari ▸ Voorkeuren ▸ Geavanceerd ▸ Ontwikkel-menu in menubalk tonen

Open een webpagina en selecteer de menu optie Ontwikkel ▸ Toon webinfovenster, activeer de optie ‘Elementen’ linksboven in het venster.

Door nu met je muis te klikken op de verschillende elementen in het webinfovenster wordt het bijbehorende element gemarkeerd op de website. Door te dubbelklikken op een element kun je ‘on the fly’ inhoud van de webpagina wijzigen. Dit geeft je de mogelijkheid om hele leuke screenshots van websites te maken met daarin bijvoorbeeld je eigen naam.

Een andere optie om een website te bewerken is met behulp van de foutconsole deze activeer je via het menu: Safari ▸ Ontwikkel ▸ Toon foutconsole. Type in foutconsole het onderstaande commando:

document.body.contentEditable = true 

Wanneer je op de tekst in een webpagina klikt kun je de tekst aanpassen. Deze edit functie kun je weer uitschakelen met het commando:

document.body.contentEditable = false 

Marcel bedankt voor de tip!

info
Auteur Richard IJzermans
Bijgewerkt31/03/2011 09:04
Categorie macOS
Feedback Probleem melden
Delen 𝕏
  5 reacties

Reacties

  • Hm, nog een laatste opmerking: nou net op deze website lijkt het niet te werken… :-(
    Maar op andere weer wel…

    Beantwoorden
  • Oh, oeps, en dan hier de code nog! :-S

    javascript:document.body.contentEditable=’true’; document.designMode=’on’; void 0

    Beantwoorden
  • Leuk, maar dit kan echt véél simpeler!
    Kopieer en plak onderstaande code in de adresbalk, druk op enter, en aanpassen maar.
    Opslaan als bookmark en je hebt ‘m altijd bij de hand.
    Werkt ook op Windows en in andere browsers overigens.

    Idee voor toepassing:
    Open een website, pas deze aan met bovenstaande methode, en kies dan in het menu ‘Verstuur inhoud van pagina’ (of opslaan als webarchief).
    Op die manier kun je heel makkelijk een ‘aangepast’ nieuwsbericht van bijvoorbeeld nu.nl versturen zonder dat het de ontvanger opvalt (de kans dat ze het bericht ook online gaan bekijken is niet zo groot, omdat het hele bericht al in de mail staat.

    1 april ideetje? ;-)

    Beantwoorden
  • Gebruik de console zelf heel veel (krijg je als web developer…) en nooit bedacht dat het ook best grappig kan zijn voor non-nerds. ;)

    Leuke hoek ! :)

    Beantwoorden
  • Leuke voorbeeld afbeelding :) Altijd handig, kon ook worden uitgevoerd met een javascriptje in cross-browsers geloof ik.

    Beantwoorden

Laat een reactie achter



Download gratis de appletips app
voor iPhone en iPad in de App Store