Hoe de iPhone Debug Console of Web Inspector te activeren

Inhoudsopgave:

Hoe de iPhone Debug Console of Web Inspector te activeren
Hoe de iPhone Debug Console of Web Inspector te activeren
Anonim

Wat te weten

  • Activeer Web Inspector op iOS: Ga naar Settings > Safari > Advanced en verplaats de Web Inspector tuimelschakelaar naar de On positie.
  • Gebruik Web Inspector op macOS: verbind uw iOS-apparaat met een Mac en kies de URL die u wilt inspecteren in het Develop menu.

Als je een bug of een ander probleem tegenkomt met een website op Safari mobile, gebruik dan de Web Inspector-tool om het te onderzoeken. In dit artikel wordt uitgelegd hoe u de Safari-console voor iPhone gebruikt om fouten op te sporen met behulp van uw Mac-computer. De instructies zijn van toepassing op iPhones met iOS 14, iOS 12 of iOS 11, en ook op Macs met macOS Big Sur (11.0), macOS Catalina (10.15) of macOS Mojave (10.14).

Activeer Web Inspector op uw iPhone of ander iOS-apparaat

De Web Inspector is standaard uitgeschakeld omdat de meeste iPhone-gebruikers er niets aan hebben. Als je echter een ontwikkelaar bent of nieuwsgierig bent, kun je het in een paar korte stappen activeren. Hier is hoe:

  1. Open de iPhone Instellingen menu.

    Op een iPhone met een vroege versie van iOS, opent u de Debug Console via Settings > Safari > Developer > Debug Console Wanneer Safari op de iPhone CSS-, HTML- en JavaScript-fouten detecteert, worden details van elk scherm in de debugger weergegeven.

  2. Scroll naar beneden en tik op Safari om het scherm te openen dat alles bevat met betrekking tot de Safari-webbrowser op uw iPhone, iPad of iPod touch.
  3. Scroll naar de onderkant van de pagina en selecteer Advanced.
  4. Verplaats de Web Inspector tuimelschakelaar naar de On positie.

    Image
    Image

Verbind uw iOS-apparaat met Safari op een Mac

Om de Web Inspector te gebruiken, verbindt u uw iPhone of een ander iOS-apparaat met een Mac met de Safari-webbrowser en schakelt u het menu Ontwikkelen in.

  1. Met Safari geopend, selecteer Safari in de menubalk en kies Voorkeuren.

    Image
    Image
  2. Selecteer de Advanced tab.

    Image
    Image
  3. Selecteer het Ontwikkel-menu in menubalk aanvinkvakje en sluit het instellingenvenster.

    Image
    Image
  4. Selecteer in de Safari-menubalk Develop en kies de naam van uw aangesloten iOS-apparaat, selecteer vervolgens de URL die verschijnt onder Safariom de foutopsporingsconsole voor die site te openen.

    Image
    Image

    Nadat je je apparaat hebt aangesloten, gebruik je je Mac om de website die je wilt opsporen te inspecteren en open deze in de mobiele Safari-browser.

Wat is Web Inspector?

Webontwikkelaars gebruiken Web Inspector om websites op Macs en iOS-apparaten aan te passen, te debuggen en te optimaliseren. Als Web Inspector is geopend, kunnen ontwikkelaars de bronnen op een webpagina inspecteren. Het Web Inspector-venster bevat bewerkbare HTML en opmerkingen over de stijlen en lagen van de webpagina in een apart paneel.

Vóór iOS 6 had de iPhone Safari-webbrowser een ingebouwde Debug Console die ontwikkelaars gebruikten om webpagina-defecten te vinden. Recente versies van iOS gebruiken in plaats daarvan Web Inspector.

Met Safari 9 en OS X Mavericks (10.9) introduceerde Apple de Responsive Design-modus in Web Inspector. Ontwikkelaars gebruiken deze ingebouwde simulator om te bekijken hoe webpagina's worden geschaald naar verschillende schermformaten, resoluties en oriëntaties.

Aanbevolen: