Question

有谁知道，我在第一次加载时有一个div元素我将其属性设置为right:0和bottom:0;我希望得到style.left，但它会返回NaN。那么如何获得它还是有其他方式吗？

<div id="myDiv">Sample</div>
<script type="text/javascript">
    var setMe = document.getElementById("myDiv");
    setMe.setAttribute("style", "background-color: red;
        position: absolute;
        width: 670px;
        height: 370px;
        right: 0;
        bottom: 0;");
    alert(setMe.style.left)
</script>

Answer 1

使用getComputedStyle() :( Demo）

进行尝试

var setMe=document.getElementById("myDiv");

setMe.setAttribute("style", "background-color:red;position:absolute;width:670px;height:370px;right:0;bottom:0;");

alert(window.getComputedStyle(setMe).left);

Answer 2

使用offsetLeft属性。

<html>
<head></head>
<body>
<div id="myDiv">Sample</div>
<script type="text/javascript">
    var setMe=document.getElementById("myDiv");
    setMe.setAttribute("style", "background-color:red;position:absolute;width:670px;height:370px;right:0;bottom:0;");
    alert(setMe.offsetLeft);
</script>
</body>
</html>

Answer 3

你有三个选择：

style property // --> Returns an object that represents the element's style attribute (setted when parsed)

getAttribute // --> returns the value of the named attribute on the specified element.

computedStyle // -->  gives the final used values of all the CSS properties of an element.

查看this fiddle（演示）中的每个示例。

此外：

如何获得style.left

3 个答案: