Hoe de Navigator userAgentData-eigenschap te begrijpen?

Hoe De Navigator Useragentdata Eigenschap Te Begrijpen



Navigator is een object dat verschillende eigenschappen biedt om de huidige webbrowserfuncties op te halen en eigenschappen die ontwikkelaars helpen bij het kiezen van de juiste browser voor hun toepassing. Dit ' Navigator 'object biedt een eigenschap met de naam 'userAgentData' die gegevens levert die betrekking hebben op de huidige webbrowser, zoals het UI-ontwerp, lettergroottes of interacties, zodat deze beter bij de gebruikersomgeving passen. Er zijn nog veel meer eigenschappen van het navigatorobject die kort worden besproken in onze Artikel 1 En artikel2 .

In deze blog wordt de eigenschap userAgentData van het Navigator-object in JavaScript uitgelegd.







Hoe de Navigator userAgentData-eigenschap te begrijpen?

De informatie verstrekt door de “ userAgentData Met deze eigenschap kunnen ontwikkelaars verschillende browseromgevingen doorzoeken en eventuele problemen identificeren die zich op specifieke platforms kunnen voordoen. Het is toegankelijk via de “ Navigator ' voorwerp. De waarden voor eigenschappen “ merken”, “mobiel” en “platform ' kan worden opgehaald met behulp van de ' userAgentData 'eigenschap van het Navigator-object.



Syntaxis

De navigator “ userAgentData ” eigenschap heeft de volgende syntaxis:



navigator. userAgentData

De bovenstaande syntaxis retourneert de waarden voor het bevatten van eigenschappen zoals “ merken”, “mobiel” en “platform ” ten opzichte van de webbrowser.





Laten we een programma maken om de praktische demonstratie te zien:

< lichaam >
< h1 stijl = 'kleur: cadetblauw;' > Linux < / h1 >< knop bij klikken = 'merken()' > Merken ophalen < / knop >
< knop bij klikken = 'mobiel()' > Mobiel ophalen < / knop >
< knop bij klikken = 'platform()' > Merken ophalen < / knop >

< script >
functie merken(){
console.log(navigator.userAgentData.brands)
}
functie mobiel(){
console.log('Je bekijkt op mobiel: ' + navigator.userAgentData.mobile)
}
functieplatform(){
console.log('Het platform of besturingssysteem dat u gebruikt:\n ' + navigator.userAgentData.platform)
}
< / script >
< / lichaam >

De beschrijving van de code die in het bovenstaande codeblok wordt weergegeven, is als volgt:



  • Eerst drie “< knop >”tags worden gebruikt die de “ merken()”, “mobiel()” en “platform() Op maat gemaakte functies met behulp van de “onclick” gebeurtenislistener.
  • Binnen de “< script >”tag, definieer de “ merken ()”-functie die merkinformatie van de webbrowser ophaalt met behulp van de eigenschap “navigator.userAgentData.brands”. Geef ook het resultaat weer dat door deze eigenschap is opgehaald via de console.
  • Definieer op dezelfde manier de “ mobiel()” en “platform() ”-functies en gebruik de “ navigator.userAgentData.mobile” en “navigator.userAgentData.platform ” eigenschappen respectievelijk.
  • Deze eigenschappen retourneren de overeenkomstige gegevens via de console.

Het eindresultaat ziet er als volgt uit:

De uitvoer laat zien dat door op de knop te klikken de overeenkomstige waarde wordt opgehaald en weergegeven in het consolevenster.

Bonustip: gebruik van de Navigator userAgent-eigenschap

De ' gebruikerAgent ” eigendom wordt ook geleverd door de “ navigator ”-object, retourneert het de naam, versie en platform voor de huidige browser die door de gebruiker wordt gebruikt. De praktische demonstratie van deze navigatoreigenschap vindt u hieronder:

< lichaam >
< h1 stijl = 'kleur: cadetblauw;' > Linuxhint < / h1 >
< knop bij klikken = 'browsergegevens()' > Browsergerelateerd Gegevens < / knop >
< P ID kaart = 'doel' >< / P >< script >
functie browserData ( ) { console.log ( navigator.userAgent ) }
< / script >
< / lichaam >

De bovenstaande code wordt beschreven als:

  • Eerst wordt de “< knop >”tag wordt gebruikt langs de “ bij klikken gebeurtenislistener die de functie “browserData()” aanroept.
  • Vervolgens dit “ browserGegevens ()”-functie wordt gedefinieerd binnen de “< script >” label. Deze functie maakt gebruik van de “ navigator.userAgent ”eigenschap en het resultaat wordt weergegeven via de console.

Voorbeeld van de webpagina na voltooiing van de bovenstaande code:

De uitvoer laat zien dat gegevens met betrekking tot de webbrowser zijn opgehaald en weergegeven via het consolevenster.

U hebt de procedure geleerd om de eigenschap userAgentData van de navigator te begrijpen.

Conclusie

De ' navigator.userAgentData De eigenschap haalt de browserspecifieke waarden op, wat veel helpt wanneer ontwikkelaars de applicatie specifiek voor één of meerdere webbrowsers maken. Deze eigenschap kan de waarden ophalen voor “ merken”, “mobiel” en “platform ”-tekenreeksen variëren de geretourneerde waarden van browser tot browser. De string moet naast de “ navigator.userAgentData ” om de waarde alleen voor die tekenreeks te retourneren. In deze blog is met succes het proces uitgelegd voor het gebruik van de eigenschap navigator.userAgentData in JavaScript.