Обнаружьте встроенный / тип блока элемента DOM
Как обнаружить, является ли элемент DOM блоком или встроенный с JavaScript?
Например, есть ли функция/свойство, которая возвращается 'встроенный' для'<a>'тег (или 'блок' для'<p>'тег)?
Спасибо.
3 ответа
Вы можете использовать getComputedStyle () и currentStyle , чтобы получить рассчитанные стили для элемента. Это должно сработать:
function getDisplayType (element) {
var cStyle = element.currentStyle || window.getComputedStyle(element, "");
return cStyle.display;
}
Чтобы быть немного яснее, вычисленные стили содержат значения для каждого свойства стиля, даже для тех, для которых свойство стиля не установлено. Эти значения будут значениями по умолчанию, поэтому в случае не стилизованного элемента , display вернет inline :
function getElementDefaultDisplay(tag) {
var cStyle,
t = document.createElement(tag),
gcs = "getComputedStyle" in window;
document.body.appendChild(t);
cStyle = (gcs ? window.getComputedStyle(t, "") : t.currentStyle).display;
document.body.removeChild(t);
return cStyle;
}
Протестировано в последней версии Firefox, Chrome и IE7 / IE8.
Результаты:
> getElementDefaultDisplay ("a") в линию > getElementDefaultDisplay ("div") блокировать
Обновление: изменено, чтобы отдать предпочтение соответствию стандартам / getComputedStyle () в IE9, который поддерживает оба метода.
информация, которая вам нужна, должна быть в свойстве display в стиле.
element.style.display
Конечно, это будет варьироваться в разных браузерах, как и все в javascript.
Традиционный и довольно уродливый способ сделать это - обратиться к списку имен элементов для элементов уровня блока:
var blockRegex = /^(address|blockquote|body|center|dir|div|dl|fieldset|form|h[1-6]|hr|isindex|menu|noframes|noscript|ol|p|pre|table|ul|dd|dt|frameset|li|tbody|td|tfoot|th|thead|tr|html)$/i;
function isBlockLevel(el) {
return blockRegex.test(el.nodeName);
}