Wat te weten
-
In Safari: Klik met de rechtermuisknop op een webpagina en selecteer Inspect Element.
- In Chrome kunt u met de rechtermuisknop klikken en klikken op Inspect.
- Om de functie in Safari in te schakelen: Safari > Preferences > Advanced > controleer de Toon Ontwikkel-menu in menubalk box.
Dit artikel leert je hoe je het element van een website op Mac kunt inspecteren. Er wordt gekeken hoe u dit kunt doen via Safari en Google Chrome.
Hoe gebruik je de functie Inspect Element op een Mac?
Voordat u elementen op de Mac inspecteert wanneer u Safari gebruikt, moet u het ontwikkelaarsmenu in de browser inschakelen. Hier leest u hoe u het inschakelt en wat u moet doen om een element te inspecteren.
Als u Ontwikkelen tussen Bladwijzers en Venster kunt zien, is het Ontwikkelaarsmenu al ingeschakeld en kunt u doorgaan naar stap 4.
De functie Element inspecteren in Safari gebruiken
Hier leest u hoe u Inspect Element gebruikt in Safari, de standaardbrowser op Mac-computers.
-
Klik in Safari op Safari > Voorkeuren.
Image -
Klik op Geavanceerd.
Image -
Klik op Toon ontwikkelmenu in de menubalk en sluit het venster.
Image - Klik tijdens het browsen op een website met de rechtermuisknop op het item dat u wilt inspecteren.
-
Klik op Inspect Element.
Image -
Je kunt nu de code bekijken achter de website die je hebt geïnspecteerd.
Image
De functie Inspect Element gebruiken in Chrome op een Mac
Als je Chrome gebruikt in plaats van Safari op je Mac, is het nog gemakkelijker om een element te bekijken omdat het niet nodig is om de functie in te schakelen. Dit is wat je moet doen.
- Blader in Chrome naar een website.
- Klik met de rechtermuisknop op het element dat u wilt inspecteren.
-
Klik op Inspecteren.
Image -
Je kunt de code nu in een zijvenster van Chrome bekijken.
Image
Waarom kan ik niet inspecteren op mijn Mac?
Het is mogelijk dat u een element op uw Mac niet kunt inspecteren als u het menu Ontwikkelaars in Safari niet hebt ingeschakeld. Hier is een herinnering over hoe je het moet doen.
-
Klik in Safari op Safari > Voorkeuren.
Image -
Klik op Geavanceerd.
Image -
Klik op Toon ontwikkelmenu in de menubalk en sluit het venster.
Image
Hoe u websitewijzigingen kunt aanbrengen door het element te inspecteren
Behalve dat je de code op een website kunt bekijken, is het ook mogelijk om tijdelijk een website-element te wijzigen via Inspect Element. Hier leest u hoe u dit doet via Safari.
Het proces lijkt erg op andere browsers.
- Klik tijdens het browsen op een website met de rechtermuisknop op het item dat u wilt inspecteren.
- Klik op Inspect Element.
- Dubbelklik op de tekst in de code om deze bewerkbaar te maken.
- Verwijder het of voer een nieuwe tekstreeks in.
- Tik op Enter.
- De code is nu tijdelijk gewijzigd, alleen voor jouw voordeel.
Waarom zou je de functie Element inspecteren willen gebruiken?
Een element kunnen inspecteren is om vele redenen nuttig.
- Om de code direct te wijzigen. Website-ontwerpers kunnen tijdelijk dingen op een website veranderen om te zien hoe de veranderingen dingen beïnvloeden.
- Om de code te controleren. Zowel ontwerpers als marketingmensen kunnen de code controleren om te bevestigen dat zaken als Google Analytics-details aanwezig zijn.
- Beelden afzonderlijk van een site bekijken. Als een site je niet toestaat om een afbeelding in een nieuw tabblad of venster te openen, kun je het element bekijken.
-
Tinker. Als u de code van een webpagina ziet, kunt u beter begrijpen wat u ziet, waardoor het mysterie wordt weggenomen van wat en waarom van wat er aan de hand is met de site waarop u zich bevindt. Het is alsof je een apparaat uit elkaar ha alt om te zien hoe het werkt, maar in dit geval zijn er geen schroeven te verliezen.
FAQ
Is het legaal om een website te inspecteren?
Ja. Als je echter van plan bent om code of middelen van een website te gebruiken, neem dan contact op met de eigenaar en voeg een copyright-notitie toe.
Hoe kopieer ik HTML van een website met het inspect-element?
Klik in Chrome met de rechtermuisknop op de pagina en selecteer Inspect, ga dan naar het bovenste gedeelte en klik met de rechtermuisknop op de tag (bijv.). Selecteer Copy > Copy outerHTML en plak de code in een tekst- of HTML-bestand.
Kan ik CSS kopiëren van een website met het inspect-element?
Ja. Klik met de rechtermuisknop op het element dat u wilt kopiëren en kies Inspect. Klik met de rechtermuisknop op de gemarkeerde code en selecteer Copy > Copy styles.
Hoe kan ik mijn opgeslagen wachtwoorden zien met het inspect element?
Om verborgen wachtwoorden te onthullen, klikt u met de rechtermuisknop op het wachtwoordtekstvak en selecteert u Inspect. Zoek in het gemarkeerde gedeelte naar type=”password” en vervang password door text. Er zijn eenvoudigere manieren om al uw wachtwoorden in Chrome weer te geven.
