>웹 프론트엔드 >JS 튜토리얼 >JavaScript를 사용하여 사용자의 브라우저 버전을 어떻게 감지할 수 있습니까?

JavaScript를 사용하여 사용자의 브라우저 버전을 어떻게 감지할 수 있습니까?

Linda Hamilton
Linda Hamilton원래의
2024-12-09 18:28:18803검색

How Can I Detect a User's Browser Version Using JavaScript?

브라우저 버전 감지: 수수께끼 풀기

웹사이트를 개발할 때 호환성을 보장하고 맞춤화하려면 사용자 브라우저의 버전을 확인하는 것이 중요할 수 있습니다. 사용자 경험. 그러나 브라우저의 유형뿐만 아니라 버전도 감지하는 코드를 찾는 것은 어려울 수 있습니다.

비밀 밝히기: 브라우저 창 엿보기

풀기 이 수수께끼를 해결하기 위해 우리는 JavaScript의 깊이를 파고들어 브라우저에 해당 버전을 쿼리하여 더 명확한 그림을 그릴 수 있는 솔루션을 찾았습니다. 기능.

코드 조각: 탐색기 창 살펴보기

다음 코드 조각을 사용하면 특정 버전과 함께 브라우저 이름을 쿼리할 수 있습니다.

navigator.sayswho = (function() {
  var ua = navigator.userAgent;
  var tem;
  var M = ua.match(/(opera|chrome|safari|firefox|msie|trident(?=\/))\/?\s*(\d+)/i) || [];
  if (/trident/i.test(M[1])) {
    tem = /\brv[ :]+(\d+)/g.exec(ua) || [];
    return 'IE ' + (tem[1] || '');
  }
  if (M[1] === 'Chrome') {
    tem = ua.match(/\b(OPR|Edge)\/(\d+)/);
    if (tem != null) return tem.slice(1).join(' ').replace('OPR', 'Opera');
  }
  M = M[2] ? [M[1], M[2]] : [navigator.appName, navigator.appVersion, '-?'];
  if ((tem = ua.match(/version\/(\d+)/i)) != null) M.splice(1, 1, tem[1]);
  return M.join(' ');
})();

console.log(navigator.sayswho); // outputs: `Chrome 62`

실천: 현실 세계 예

이 예에서는 navigator.sayswho 함수가 호출되어 브라우저 이름과 버전이 포함된 문자열을 반환하므로 버전별 작업을 수행할 수 있습니다. 예를 들어, Firefox 3 사용자를 위한 콘텐츠를 맞춤화하려면 다음 코드를 사용하여 사용자의 존재 여부를 확인할 수 있습니다.

if (navigator.sayswho.includes('Firefox 3')) {
  // Display content specific to Firefox 3
}

결론

JavaScript의 힘을 활용하면 브라우저 버전을 감지하는 비밀을 풀고 사용자의 브라우저에 원활하게 적응하는 경험을 만들 수 있습니다. 따라서 다음에 특정 브라우저 버전에 맞는 콘텐츠를 제공해야 할 때 브라우저 창의 신비를 풀 수 있는 이러한 기술을 기억하세요.

위 내용은 JavaScript를 사용하여 사용자의 브라우저 버전을 어떻게 감지할 수 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.