在样式属性中按CSS属性值选择HTML元素

Question

我有这样的HTML:

…
<div style="top: 252px; left: 54px;"></div> 
<div style="top: 252px; left: 162px;"></div> 
<div style="top: 288px; left: 108px;"></div>
…

我有一个这样的JavaScript对象文字:

var pos = { top: 252, left: 54 };

我想选择具有对象文字指示位置的元素.位置是唯一的,因此只选择一个元素.

谢谢你的回答.

Answer 1

我只能说不要这样做!

如果您可以为div添加唯一的位置样式,则可以同时轻松添加标识符.

使用此标识符选择javascript中的元素,而不是css定位.

Answer 2

信用到这里的原始海报;

jQuery通过内联css属性查找

该函数是'styleEquals',可以实现为;

jQuery.extend(jQuery.expr[':'], {
    styleEquals: function(a, i, m){
        var styles = $(a).attr("style").split(" ")
        var found = false;
        for (var i = 0; i < styles.length; i++) {
                if (styles[i]===m[3]) {
                        found = true;
                        break;
                }
        }
        return found;
    }
});

然后,您可以使用新的jquery扩展函数按照其样式属性值搜索元素,例如;

$("div:styleEquals('top=252px'):styleEquals('left:54px')");