如何使用Javascript检测元素的文本方向？

Question

使用Javascript检测html元素的文本方向的最佳方法是什么？我希望得到“rtl”或“ltr”。

<div dir="ltr" id="foo">bar</div>

<div style="direction:ltr" id="baz">quux</div>

<div dir="ltr"><div id="jeez">whiz</div></div>

我如何测试“foo”，“baz”或“jeez”的方向？

Answer 1

现代浏览器（IE9 +和其他浏览器）中提供了

getComputedStyle。

getComputedStyle(document.getElementById('foo')).direction

http://jsfiddle.net/m8Zwk/

Reference to getComputedStyle on Mozilla Developer Network

Answer 2

试试这个

document.defaultView.getComputedStyle(document.getElementById('baz'),null)['direction'];

OR

style = document.defaultView.getComputedStyle(document.firstChild,null);
console.log(style.direction);

Answer 3

@ explosion-pills答案是对的。我做了一些关于IE兼容性的研究，并提出了以下建议：

function getDirection(el) {
    var dir;
    if (el.currentStyle)
        dir = el.currentStyle['direction'];
    else if (window.getComputedStyle)
        dir = getComputedStyle(el, null).getPropertyValue('direction');
    return dir;
}

这应该适用于Firefox 3.6，它需要null作为getPropertyValue的第二个参数。

由于这提供了更多信息，我认为我会发布它，以防有人帮助。

Answer 4

您只需使用style对象：

console.log(document.getElementById('baz').style.direction);

DEMO

请注意，DOM的此对象仅表示元素的内嵌样式，它不适用于任何css样式表。