Javascript 如何按样式属性值获取元素?

Javascript 如何按样式属性值获取元素?,javascript,Javascript,我需要使用display:none样式获取所有div元素,然后删除所有这些元素。我还需要只选择包含在somecontainer元素中的div。必须在原始javascript中完成。有什么想法吗 html示例: <table id="listtabletemp"> <thead> <tr id="theader"> <td id="theaderleft">loolz</td>

我需要使用display:none样式获取所有div元素,然后删除所有这些元素。我还需要只选择包含在somecontainer元素中的div。必须在原始javascript中完成。有什么想法吗

html示例:

    <table id="listtabletemp">
    <thead>
        <tr id="theader">
            <td id="theaderleft">loolz</td>
        </tr>
    </thead>
    <tbody>
        <tr class="" rel="13117025">
            <td><div><style>
.ikthgjyhtr{display:none}
.tVOx{display:inline}
</style>
                <div style="display:none">crap here</div>
                <div></div>
                <div></div>
                <div style="display:none">crap here</div>
                <div class="230">something good</div>
                <div class="ikthgjyhtr">crap here</div>
                <div style="display:none">crap here</div>
                <div class="ikthgjyhtr">crap here</div>
                <div style="display: inline">something good</div>something good
                <div style="display: inline">something good</div>
                <div class="21">something good</div>
                <div style="display:none">crap here</div>
                <div style="display:none">crap here</div>
                <div style="display:none">crap here</div>
                <div class="4">something good</div>
                <div class="224">something good</div></div>
            </td>
        </tr>
    </tbody>
</table>

简单地说,DOM是您的朋友:

function removeDivs() {
    var container = document.getElementById("somecontainer");
    var divs = container.getElementsByTagName("div");
    var empty = [];
    var getStyle = function(obj, css){
        var style = null;
        if(obj.currentStyle) {
            style = obj.currentStyle[css];
        } else if(window.getComputedStyle) {
            style = window.getComputedStyle(obj, null).getPropertyValue(css);
        }
        return(style);
    };
    for(var i = 0, len = divs.length; i < len; i++) {
        var div = divs[i];
        if(div && ((div.style.display && div.style.display == "none") || getStyle(div, "display") == "none")) {
            empty.push(div);
        }
    }
    for(var i = 0, len = empty.length; i < len; i++) {
        var div = empty[i];
        div.parentNode.removeChild(div);
    }
}

又快又脏,这里有一些东西可以让你开始:


这将使用display:none样式删除div。我用OP的例子测试了它。注意:我在测试时添加了一些容器id

功能移除{ 严格使用; //一些容器。 const someContainer=document.getElementByIdsome-container; //里面有潜水艇。 const divsInside=someContainer.querySelectorAlldiv; //循环,如果显示:无,则删除div。 前额{ const style=window.getComputedStyleSide; 如果style.display==无{ someContainer.removechilddinside; } }; } 去除静脉;
删除所有这些元素是什么意思?如果它们有display:none,它们不是已经被删除了吗。或者你的意思是完全移除它?在这种情况下,只需找到div并删除它们。您的意思是要删除el.style.display?顺便说一句:实际的术语是vanilla js:@Kay从你的评论来看,这个术语似乎不是vanilla js,因为你链接到了一个框架。@hhamilton是的……你没有听懂这个笑话;向下滚动一点。@Jacedc我需要将它们从dom树中删除。在jQuery等效外观中:$gsdgbletemp.find:hidden.remove;如果您需要检查div是否有css样式显示:none分配给它,那么它会变得更复杂,因为div.style.display==用于css分配的显示值。@HMR很好;我已经更新了函数以考虑到这一点。@vladkras旧习惯很难改变,但你说得很清楚,这部分是可选的。另外:应该是div.parentNode.removeChildiv,因为getElementsByTagName将返回容器深处的所有div。我有一种感觉,这就是他的意思;然而,op从未指定外力。我将加入一个我已经准备好的函数@这似乎是一个经过充分研究的答案,但相当冗长,不能直接解决问题。你能把它修改/编辑成解决最初问题所需的部分吗?斯科特,你说得对。我的回答应该更加简洁,并且针对最初的问题。我重新做了我的回答。我感谢你的指导。
var parent = document.getElementById('parent');
var items = parent.getElementsByTagName('DIV');
var hidden = [];
for (var i in items){
    if ((items[i]).getAttribute !== undefined){
        if ((items[i]).hasAttribute('style')){
            if ((/display\:\s*none/gi).test(items[i].getAttribute('style'))){
                hidden.push(items[i]);
            }
        }
    }
}

for (var i in hidden){
    hidden[i].parentNode.removeChild(hidden[i]);
}