JavaScript é o idioma principal do desenvolvimento do front-end. Geralmente, existem duas maneiras de julgar os tipos de navegador em JavaScript. Este artigo analisa as características do respectivo usuário do navegador e fornece um método de julgamento:
Série de navegador do sistema operacional Windows:
Ou seja, série de navegador:
Características: tudo começa com "Mozilla/" e X em "MSIE X.0;"
Método de julgamento: você pode pesquisar apenas a string msie x.0;
Firefox for Windows:
Recursos: Comece com "Mozilla/X.0", incluindo "Windows NT", "Gecko/" e "Firefox/";
Método de julgamento: Para julgamento aproximado, você só pode recuperar as cordas "Firefox/" e "Windows NT". Firefox/";
Chrome for Windows:
Recursos: Comece com "Mozilla/X.0", incluindo "Windows NT", "Chrome/", e também inclua "Applewebkit/", "Safari/";
Método de julgamento: Junte aproximadamente, você pode pesquisar apenas "Windows NT" e "Chrome/" Strings, e julgar estritamente, você pode pesquisar "Mozilla/", "Windows NT", "Applewebkit/", "Safari/", "Chrome /"5 cordas;
Opera para Windows:
Características: comece com "Opera/" e contém "Windows NT", "Presto/" Strings;
Método de julgamento: julgue aproximadamente apenas a procura de "Strings Windows NT" e "Opera/" e julgue estritamente a busca de "ópera/", "Windows NT" e "Presto/" ao mesmo tempo;
Safari for Windows:
Características: comece com "Mozilla/" e contenha "Windows NT", "Applewebkit/", "Safari/";
Método de julgamento: Junte aproximadamente, você pode procurar "Windows NT", "Safari/" e não "Chrome/". /"Mas" Chrome/"não está incluído;
Resumo: o usuário do navegador no sistema operacional Windows contém a sequência "Windows NT" para representar o sistema operacional do Windows.
Série de navegador da plataforma para iPhone:
O iPhone vem com Safari:
Características: Começando com "Mozilla/", contém a string "iPhone" e também contém a "String móvel/", "Safari/";
Método de julgamento: Junte aproximadamente apenas a pesquisa de "iPhone" e "Safari/" Strings.
Opera Mobile para iPhone:
Características: Começando com "Opera/", contém a string "iPhone" e também contém a "Opera Mini/", "Presto/" String;
Método de julgamento: Junte aproximadamente as pesquisas apenas por "iPhone" e "Opera/" Strings.
Resumo: o usuário do navegador em telefones iPhone contém a string "iPhone"
Android Platform Browser Series:
O Android vem com um navegador (algumas pessoas dizem que é apenas o Chrome, mas o Google não faz nenhuma declaração e está desenvolvendo um Chrome para fazer telefone em execução no Android):
Características: Começando com "Mozilla/", contém strings "Android" e "Linux", e também contém "AppleWebkit/", "Mobile Safari/" Strings;
Método de julgamento: como não sei se haverá safari independente no Android no futuro (acho que não será), é recomendável fazer julgamentos rigorosos diretamente e procurar "Mozilla/" "Android", " Linux "," AppleWebkit/"," Mobile Safari/"Cinco Strings
Opera Mobile para Android:
Características: Começando com "Opera/", contém "strings Android" e "Linux", e também contém "Opera Mobi/", "Presto/" Strings;
Método de julgamento: Junte aproximadamente apenas as pesquisas "Android" e "Opera/", e os juízes estritamente devem incluir "Opera/", "Android", "Linux", "Opera Mobi/", "Presto/" Cinco Strings
Firefox para Android:
Características: Começando com "Mozilla/", contendo strings "Android" e "Linux", e também contendo "Firefox/", "Gecko/", "Fennec/" Strings;
Método de julgamento: Junte aproximadamente apenas as pesquisas "Android" e "Firefox/", e os juízes estritamente devem incluir "Mozilla/", "Android", "Linux", "Firefox/", "Gecko/", "Fennec/" Six Six Uma corda
Resumo: o usuário do navegador na plataforma Android contém strings "Android" e "Linux"
A análise acima dos navegadores convencionais das três principais plataformas do Windows, iPhone e Android terminou basicamente. Seja semelhante à plataforma do iPhone; portanto, por enquanto, não farei a análise por enquanto, porque não tenho tantos dispositivos e sistemas operacionais para testar, espero poder compensar isso no futuro.
Os requisitos atuais de desenvolvimento de produtos do site são diferentes de antes, porque ele não apenas precisa atender à navegação no computador, mas também precisa atender aos smartphones dos usuários (aqui apenas nos referimos a smartphones reais como iPhone, Android, Windows Phone e Niches como BlackBerry e Palm, o sistema semi-inteligente não é considerado por enquanto. Julgue o equipamento do usuário com base no usuário do navegador.
1. Se você precisar julgar o sistema operacional, o método é relativamente simples.
Contém "Windows NT": é óbvio que o número da versão após o NT pode determinar a versão do sistema operacional;
Sistemas que contêm "Mac": Mac OS X da Apple ou outros kernels do Mac OS;
Contém "iPhone": exclusivo dos telefones Apple iPhone e também deve conter "Mac" em geral;
Contém "iPad": tablet Apple iPad (as informações mostram que o usuário do navegador do iPad também contém "mac", "iPhone", "iPad");
Contém "Linux": sistema operacional Linux ou outro sistema operacional com o Linux como o kernel;
Contém "Android": o sistema operacional Android do Google pode ser um smartphone ou uma versão do Android do tablet.
Ele contém um dos três: sistema Unix, mas, de fato, os problemas de experiência do usuário desse sistema são quase desnecessários de se considerar;
Linux contendo "Ubuntu": versão personalizada do Ubuntu
...
Você também viu que julgar o sistema operacional e sua versão nem sempre é útil, mas sempre há lugares que podem ser usados, como o desenvolvimento de páginas que visam especificamente a resolução da tela de dispositivos como iPhone, iPad e Android, etc.
2. Não é difícil julgar o núcleo do navegador.
Isto é (tridente) kernel (ou seja, para Mac, ies4linux, etc., considere apenas o Windows): comece com "Mozilla/" e contém "Windows nt" e "msie";
Kernel Firefox (Gecko): comece com "Mozilla/", contém as cordas "Firefox/" e "Gecko/", entre as quais a versão Android também possui a String "Fennec/";
Opera () kernel: começa com "Opera/" e contém a "string presto/", a versão para iPhone também possui "Opera Mini/", e a versão Android também possui "Opera Mobi/";
Webkit Kernel: Comece com "Mozilla/", contém as cordas de "Applewebkit/" e "Safari/", e o navegador Chrome com "Chrome/" é o sem safári ou outros;
O exposto acima é o núcleo principal do navegador
O kernel do navegador é o problema principal na solução de compatibilidade , é claro, o mesmo kernel torna os resultados em diferentes dispositivos, como smartphones e computadores, e isso também precisa receber atenção.
3. Exemplos da aplicação real do navegador useagent:
Diferentes núcleos do navegador têm diferentes efeitos de renderização nas páginas.
Os usuários não apenas acessam os sites por meio de computadores. O tablet está bem, a tela tem uma resolução grande e alta. Você está certo? Afinal, é muito desconfortável assistir a páginas da web através de zoom e arrasto local. acelerar acesso;
Faça análise de tráfego de visitantes, otimize e projete seu próprio site, julgando o tipo de navegador de clientes e registrando o número de clientes para melhorar sua experiência com o cliente separadamente
A cópia do código é a seguinte:
<script type = "text/javascript">
var sys = {};
var ua = navegator.UserAgent.TolowerCase ();
var s;
(s = ua.match (/msie (/d. ]+)/)?
(s = ua.match (/firefox // ([/d.]+)/))?
(s = ua.match (/chrome // ([/d.]+)/))?
(s = ua.match (/Ópera. ([/d.]+)/))?
(s = ua.match (/versão // ([/d.]+).*Safari/))?
// Os seguintes testes
if (sys.ie) document.write ('ie:' + sys.ie);
if (sys.firefox) document.write ('firefox:' + sys.firefox);
if (sys.chrome) document.write ('Chrome:' + sys.chrome);
if (sys.opera) document.write ('Ópera:' + sys.opera);
if (sys.safari) document.write ('safari:' + sys.safari);
</script>
ou:
Métodos para detectar navegadores no código de código do editor de código aberto Kindeditor: Código fonte:
Ke = {};
Ke.browser = (function () {
var ua = navegator.UserAgent.TolowerCase ();
retornar {
Versão: ua.match (/(msie | Firefox | webkit | Opera) [//:/s] (/d+)/)?
Ou seja: (ua.indexOf ("msie")> -1 && ua.indexof ("Ópera") == -1),
Gecko: (ua.indexOf ("Gecko")> -1 && ua.indexof ("khtml") == -1),
Webkit: (ua.indexof ("Applewebkit")> -1),
Ópera: (ua.indexOF ("Ópera")> -1)
};
}) ();