Функция определения браузера и его версии

Как-то потребовалось создать функцию, принимающую объект json со следующим форматом записи: "браузер":то, что следует вернуть, иначе говоря такую функцию, которая бы возвращала указанный объект в зависимости от браузера пользователя.

ТЗ, которое я для себя определил:

браузеры можно группировать, указывая их через пробел
браузерам можно задавать версию (ie6,opera10)
браузерам можно задавать полную версию (opera10.15)
поддержка самых популярных браузеров

Мой способ гарантированно не самый точный, так как он используют свойство userAgent объекта navigator, которое при желании подделывается, но с другой стороны любой способ проверки клиента как серверный, так и клиентский можно обойти. Так же встает вопрос о надобности такой "подделки", тем более мало какие роботы исполняют javascript код.

После изучения следующей статьи http://ru.wikipedia.org/wiki/Useragent, я написал функцию ifBrowser. Она поддерживает проверку следующий браузеров: Internet Explorer, Firefox, Opera, Chrome, Safari, Konqueror, Iceweasel, SeaMonkey.

Код функции:

/*
	ifBrowser 0.0.3
	a function which returns specified data depending on a user's browser
	written by Plyushch Gregory, 2012
	is free to use for everyone in condition of saving the author's name
*/
function ifBrowser (obj) {
	var none = obj["none"] || "none";
	function cBrowser() {
		var ua = navigator.userAgent;
		var bName = function () {
			if (ua.search(/MSIE/) > -1) return "ie";
			if (ua.search(/Firefox/) > -1) return "firefox";
			if (ua.search(/Opera/) > -1) return "opera";
			if (ua.search(/Chrome/) > -1) return "chrome";
			if (ua.search(/Safari/) > -1) return "safari";
			if (ua.search(/Konqueror/) > -1) return "konqueror";
			if (ua.search(/Iceweasel/) > -1) return "iceweasel";
			if (ua.search(/SeaMonkey/) > -1) return "seamonkey";}();
		var version = function (bName) {
			switch (bName) {
				case "ie" : return (ua.split("MSIE ")[1]).split(";")[0];break;
				case "firefox" : return ua.split("Firefox/")[1];break;
				case "opera" : return ua.split("Version/")[1];break;
				case "chrome" : return (ua.split("Chrome/")[1]).split(" ")[0];break;
				case "safari" : return (ua.split("Version/")[1]).split(" ")[0];break;
				case "konqueror" : return (ua.split("KHTML/")[1]).split(" ")[0];break;
				case "iceweasel" : return (ua.split("Iceweasel/")[1]).split(" ")[0];break;
				case "seamonkey" : return ua.split("SeaMonkey/")[1];break;
			}}(bName);
		return [bName,bName + version.split(".")[0],bName + version];
	}
	var current_browser = cBrowser();
	for (var key in obj) {
		var trg = key.toLowerCase();
		if (trg.indexOf(current_browser[2]) > -1) return obj[key];
		else if (trg.indexOf(current_browser[1]) > -1) return obj[key];
		else {
			var nsymbol = trg.charAt(trg.indexOf(current_browser[0])+current_browser[0].length);
			if (trg.indexOf(current_browser[0]) > -1 && (nsymbol == " " || nsymbol == "")) return obj[key];
		};
	}
	return none;
}

http://gregivy.tf9.ru/ivyco/ifbrowser.js

В случае если ни одного выражение не совпадает с браузером пользователя, возвращается "none", которое можно также указать как свойство передаваемого объекта.

Пример использования: (данный код повернет на 25 градусов все содержимое страницы в любом современном браузере)

var transform = ifBrowser({
	"ie":"msTransform",
	"chrome safari":"WebkitTransform",
	"firefox":"MozTransform",
	"opera":"OTransform",
					
}) // определяем название нужного нам css свойства
document.body.style[transform] = "rotate(25deg)"

Пример наклона картинки на 60 градусов

Название браузера нужно вводить в следующем формате : ie, firefox, opera, chrome, safari, konqueror, iceweasel, seamonkey. Регистр неважен. Версия пишется слитно с название, пример: ie7. Если для нескольких браузеров должно возвратиться одно и тоже значение, вы просто указываете их через пробел, как
на примере ("chrome safari":"WebkitTransform"). В качестве возвращаемого значения может выступать любой объект JavaScript (строка, число, функция, логическое значение и т.д.)

Блог: Плющ Григорий

Автор: mihdan, дата: 1 августа, 2012 - 14:41

Форум

Справочник

Discord чат

Курсы javascript

Функция определения браузера и его версии

Отправить комментарий

Учебник javascript

Основные элементы языка

Сундучок с инструментами

Интерфейсы

Все об AJAX

Оптимизация

Разное