Question

我的网站上有很多DIV个。每个包含一个产品。我想删除或隐藏具有某些名称的那些。例如 - 我希望脚本隐藏包含“食物”名称的所有DIV。

一旦你这样做了？我在其他线程中寻找答案，但我没有自己ID的div。

提前感谢您的帮助和建议。

<div 
    data-id="AAA1"
    data-title="CLoth"
    data-bptf-cost="12"
    data-hat-cost="12"
>
<div 
    data-id="AAA2"
    data-title="Food"
    data-bptf-cost="12"
    data-hat-cost="12"
>
<div 
    data-id="AAB3"
    data-title="Money"
    data-bptf-cost="12"
    data-hat-cost="12"
>

Answer 1

U可以为每个div提供不同或相同的ID。例如：

<div id="food">Some food</div>
<div id="food">Soome other food</div>
<div id="fruits">Some fruits</div>

如果您现在编写一个脚本，并使用名称food隐藏所有ID，前两个将隐藏，水果将保持打开状态。

一个非常简单的例子，但CSS展示了我刚才写的内容。如你所见，我隐藏了所有ID的食物。

http://jsfiddle.net/Lf9EN/

Answer 2

首先要给你的div一个结束标记！

给这一点。

<script type="text/javascript">

    setTimeout(function () {
        var divs = document.body.querySelectorAll('div');
        for (var i = 0; i < divs.length; i++) {

            if (divs[i].getAttribute('data-title') && divs[i].getAttribute('data-title') === 'Food') {

                divs[i].style.visibility = 'hidden';
            };
        };
    }, 100);
</script>

<强> --- ---的Html

<div data-id="AAA1"
     data-title="CLoth"
     data-bptf-cost="12"
     data-hat-cost="12">
</div>
<div data-id="AAA2"
     data-title="Food"
     data-bptf-cost="12"
     data-hat-cost="12">
</div>
<div data-id="AAB3"
     data-title="Money"
     data-bptf-cost="12"
     data-hat-cost="12">
</div>

隐藏或删除没有ID的DIV

2 个答案: