JavaScriptの配列の要素を削除できません

Question

コードの一部は、その要素の一部が入力パラメータと一致する場合、関数removeClassは配列の要素を削除する必要があります。

しかし、動作しません。

var obj = { 
 
    className: 'open menu' 
 
}; 
 

 
function removeClass(obj, cls) { 
 
    var arr = obj.className.split(' '); 
 

 
    for (var i = 0; i < arr.Length; i++) { 
 
    if (cls == arr[i]) delete arr[i] 
 
    } 
 

 
    obj.className = arr.join(' '); 
 

 
    return obj.className; 
 
} 
 

 
console.log(removeClass(obj, 'open')); 
 
// desired output obj.className='menu' 
 
// actual output 'open menu'

Answer 1

このためArray.prototype.filter()方法を使用することができます。

var obj = { 
    className: 'open menu' 
}; 

function removeClass(obj, cls) { 
    var arr = obj.className.split(' '); 

    obj.className = arr.filter(function(item) { 
    return cls !== item; 
    }).join(' ') 

    return obj.className; 
} 

console.log(removeClass(obj, 'open')); 

コードでは、arr.Lengthを使用しています。実際の構文はarr.lengthです。しかし、あなたのコードを修正しても、その代わりにアイテムを削除することはありません。代わりにundefinedを置くと、余分な空白を処理する必要があります。だから私は上記の解決策は良いと思うのです。

Answer 2

このお試しください：

var obj = { 
 
     className: 'open menu dogs cats' 
 
    }; 
 

 
    function removeClass(obj, cls) { 
 
     return (obj.className = obj.className.split(' ').filter(item => cls !== item).join(' ')); 
 
    } 
 

 
    console.log(removeClass(obj, 'open')); 
 
    console.log(removeClass(obj, 'dogs'));

をしかし、あなたはDOM要素にこれを実行しようとしている場合は、代わりにclassListを使用しています。

var el = document.getElementById("mine"); 
 

 
console.log(el.className); 
 
el.classList.remove('open'); 
 
console.log(el.className); 
 
el.classList.remove('dogs'); 
 
console.log(el.className);

<div id="mine" class="menu open dogs cats"></div>

Answer 3

なぜ文字列を置き換えないのですか？また

var obj = { 
 
    className: 'open menu' 
 
}; 
 

 
function removeClass(obj, cls) { 
 
    return obj.className = obj.className.replace(cls, '').trim() 
 
} 
 

 
console.log(removeClass(obj, 'open')); // obj.className='menu'

DOMでの作業中に、これは

const b = document.querySelector('button') 
 
b.addEventListener('click',() => { 
 
    b.classList.remove('blue') 
 
})

.red { 
 
    color: red 
 
} 
 

 
.blue { 
 
    color: blue 
 
}

<button class="red blue">test</button>

Answer 4

ES6であなたも作ることができるdooingための方法が既に存在しているこれは本当に短い

あなたは要素自体を変更したい場合は

function removeClass(element, classToRemove) { 
    return element.className.split(' ') 
        .filter(class => class !== classToRemove) 
        .join(' '); 
} 

、何が動作しませんelement.className