Javascript如何检查一个条件是否已经满足,并不再应用它

Javascript how to check if a condition is already met and not apply it again?

本文关键字:满足 应用 不再 是否 一个 何检查 检查 Javascript 条件      更新时间:2023-09-26

尽量不要在计数为7或更小的时候设置背景色,如果它已经是红色,就不应该再设置了。

<div class="parent">
    <ul class="list">
        <li class="item">Item 1</li>
        <li class="item">Item 2</li>
        <li class="item">Item 3</li>
        <li class="item">Item 4</li>
        <li class="item">Item 5</li>
        <li class="item">Item 6</li>
        <li class="item">Item 7</li>
    </ul>
</div>

当计数小于7时,如何停止反复设置颜色?

var parent = document.querySelector('.parent');

parent.addEventListener('click', changeColor, false);
function changeColor( e ) {
    var element = e.target;
    var item = document.querySelectorAll('.item'); 
    element.parentNode.removeChild(element);
    if( item.length <= 7 ) {
        parent.style.background = "red";
        console.log(
        item.length + " set backgroud color"
        )
    }

    }
演示http://jsfiddle.net/Grundizer/awc6rymn/

如果我对你的问题理解正确的话,这应该能奏效:

var parent = document.querySelector('.parent');
var background = 'false';
parent.addEventListener('click', changeColor, false);
function changeColor( e ) {
    var element = e.target;
    var item = document.querySelectorAll('.item'); 
    element.parentNode.removeChild(element);
    if( item.length <= 7 && parent.style.background != 'red') {
        parent.style.background = "red";
        console.log(
        item.length + " set backgroud color"
        )
    }

如果count小于7,则可以删除事件侦听器。这样,你不仅不会再改变颜色,你也不会在点击时运行任何东西。

if( item.length <= 7 ) {
        parent.style.background = "red";
        parent.removeEventListener('click', changeColor, false);
    }

如果你有一个函数添加元素,只需重新开始收听