Re: [問題] dom的getElementsByClassName
※ 引述《flowwinds (..)》之銘言：
: 大家好,
: 寫了個function
: ---------------------------------------------------------
: function removeClass(dom_root, className){
: var doms = dom_root.getElementsByClassName(className);
: if(doms.length > 0){
: var i;
: console.log("doms length:"+doms.length);
: for (i = 0; i < doms.length > 0;i=i+1) {
: console.log("before length:"+doms.length);
: if(doms[i] != null){
: doms[i].classList.remove(className);
: }
: console.log("after length:"+doms.length);
: }
: }
: }
: ---------------------------------------------------------
: 印出的結果是
: --------------------
: doms length:3
: before length:3
: after length:2
: before length:2
: after length:1
: --------------------
: 而array就有一個element就沒處理到
: 有人知道這是甚麼原因嗎?
: 看起來就是class remove掉後, getElementsByClassName()的結果也會即時更新?
: 謝謝~
其實原因你自己也說了，你修改doms的內容，doms就改變了，連帶著doms.length也會跟
著變（這個你自己也可以從console.log的結果中看出來）。所以可以先用一個變數把原
初的length存起來給迴圈使用。
另一個問題是你的doms陣列越來越小，你卻用越來越大的index來處理這個陣列。
比方說第一次迴圈時你的doms可能是[dom, dom, dom]，然後你處理第0個dom (i=0)。
第二次迴圈時你的doms是[dom, dom]，然後你處理第1個dom (i=1)。
第三次迴圈時你的doms是[dom]，然後你處理第2個dom (i=2)。
看出問題來了嗎？
其實你可以一直處理第0個dom就可以了。
修改後如下：
function removeClass(dom_root, className){
var doms = dom_root.getElementsByClassName(className);
var domLength = doms.length; //存初始的長度
if(doms.length > 0){
var i;
console.log("doms length:"+doms.length);
for (i = 0; i < domLength > 0;i=i+1) {
console.log("before length:"+doms.length);
if(doms[0] != null){ // 改成刪除第0個元素的class
doms[0].classList.remove(className);
}
console.log("after length:"+doms.length);
}
}
}
希望有幫助到你
--
※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 50.68.15.70
※ 文章網址: https://www.ptt.cc/bbs/Ajax/M.1556659415.A.260.html
※ 編輯: bakedgrass (50.68.15.70), 05/01/2019 05:30:32
※ 編輯: bakedgrass (50.68.15.70), 05/01/2019 05:32:05
推
05/01 15:45,
5年前
, 1F
05/01 15:45, 1F
→
05/01 15:59,
5年前
, 2F
05/01 15:59, 2F
推
05/01 22:56,
5年前
, 3F
05/01 22:56, 3F
推
05/11 20:52,
5年前
, 4F
05/11 20:52, 4F
推
05/14 13:05,
5年前
, 5F
05/14 13:05, 5F