我可以设置这些属性吗:
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
在带有 javascript 的元素上。我通常这样做:
var element = document.getElementById("#element")
element.style.display = "flex";
但是那里的其余属性呢,我可以做些什么来应用它们?
最佳答案
您可以进一步开发此代码段:
var elem = document.getElementById('id_of_element_to_check'),
dispValue = ['-webkit-box', '-moz-box', '-ms-flexbox', '-webkit-flex', 'flex'],
n;
for (n = 0; n < dispValue.length; n++) {
elem.style.display = dispValue[n];
if (window.getComputedStyle(elem, null).display === dispValue[n]) {
break;
}
}
想法是,window.getComputedStyle()
不会返回无效值。也可以将检查放在 while
条件中,但在 for
循环中进行可能是最安全的。我在 Chrome28、FF22 和 IE10 中对此进行了测试。
关于javascript - 在元素跨浏览器上设置显示属性 flex,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17896846/