檢查位置是否存在

Question

我有一個包含元素和相對位置的頁面。

style="position: relative;" 

一些有頂/左座標，有些沒有。有沒有辦法使用jQuery檢查style標籤內的座標？

如果沒有，我想通過做一些像添加它們：

if (...) { 
    var myDiv = $(".myDiv");  
    var pos = myDiv.position(); 
    myDiv.css({ "left:" + pos.left + "px", "top:" + pos.top + "px" }); 
} 

Answer 1

這表現在this jsfiddle頂部的默認值/ left是「auto」「。因此，要檢查CSS值是否設置，您可以檢查值是否爲「auto」。

---

測試：

<div style="position: relative;"></div> 

<div style="position: relative; left: 10px;"></div> 

<div style="position: relative; left: badvalue;"></div> 

<script type="text/javascript"> 
    $(function() { 
     $('div').each(function() { 
      alert($(this).css('left')); 
     }); 
    }); 
</script> 

Answer 2

可以使用css方法：

var hasTop = $('#element').css('top') !== 'auto'; 
var hasLeft = $('#element').css('left') !== 'auto'; 

爲top和left的默認值是auto，所以如果css方法沒有返回，那麼你知道樣式屬性已經設置在別處。

Answer 3

你可以簡單地檢查這些樣式聲明如下圖所示，

DEMO

HTML：

<span style="position: relative;"></span> 
<span style="position: relative; top: 100px; "></span> 
<span style="position: relative;"></span> 
<span style="position: relative; left: 10px;"></span> 
<span style="position: relative;"></span> 

JS

$('span').each (function() { 
    alert(this.style.left != '' || this.style.top != ''); 
});