[ergonomic]

Привет всем!
Возник вопрос. Как лучше проверить поддержку свойства CSS и значения свойства. Какой из вариантов наиболее корректен?

function cs(p, v) {
	var e = document.createElement('p');
	e.style.cssText = p + ':' + v; // добавляем к элементу свойство через cssText с целью экранировать ошибку, если значение свойства не поддерживается браузером
	return e.style[p] === v; // проводим сравнение и возвращаем true/false
}

var fx = ['flex', '-webkit-flex', '-webkit-box', '-moz-box', '-ms-flexbox']; // набор значений с вендорными префиксами
for (var i = 0; i < fx.length; i++) {
	console.log(cs('display', fx[i]));
	// по true - что-то начинаем делать
}

Вопрос возникает по-причине того, что все решения по проверке поддержки CSS свойств построены на обращении к DOM-свойству элемента и проверки его существования. Например:

var e = document.createElement('p');
var s = e.style;
if ('flex' in s) console.log('flex');
if ('WebkitFlex' in s) console.log('WebkitFlex');
if ('WebkitBoxFlex' in s) console.log('WebkitBoxFlex');
if ('MozBoxFlex' in s) console.log('MozBox');
if ('msFlex' in s) console.log('msFlex');