第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問(wèn)題,去搜搜看,總會(huì)有你想問(wèn)的

動(dòng)態(tài)更改的列表無(wú)法按預(yù)期工作 - 需要純 js

動(dòng)態(tài)更改的列表無(wú)法按預(yù)期工作 - 需要純 js

catspeake 2021-09-30 17:14:11
我想動(dòng)態(tài)更改列表元素的順序。單擊后,被單擊的元素應(yīng)跳轉(zhuǎn)到第一位。但它總是跳到最后一個(gè)地方。有什么建議嗎?    const ulElement = document.getElementById('nav-list');    const fragment = document.createDocumentFragment();    const listItems = ['Home', 'Work', 'Contact'];            listItems.forEach((item) => {        const li = document.createElement('li');        li.textContent = item;        li.setAttribute('id', item.toLowerCase());        li.addEventListener('click', (event) => {            listItems.forEach((items, i) => {                if (items.toLowerCase() === event.target.id) {                    listItems.splice(i, 1);                    listItems.unshift(event.target.id);                }                fragment.appendChild(li);            });            ulElement.appendChild(fragment);            console.log(ulElement);        });        fragment.appendChild(li);    });        ulElement.appendChild(fragment);<ul id="nav-list"></ul>
查看完整描述

3 回答

?
臨摹微笑

TA貢獻(xiàn)1982條經(jīng)驗(yàn) 獲得超2個(gè)贊

替換行:

ulElement.appendChild(fragment);

和:

ulElement.insertBefore(fragment, ulElement.firstChild);


查看完整回答
反對(duì) 回復(fù) 2021-09-30
?
一只名叫tom的貓

TA貢獻(xiàn)1906條經(jīng)驗(yàn) 獲得超3個(gè)贊

謝謝你的提問(wèn);我的代碼在這里:


const ulElement = document.getElementById('nav-list');

const fragment = document.createDocumentFragment();

const listItems = ['Home', 'Work', 'Contact'];


listItems.forEach(item=>{

    const li = document.createElement('li');

    li.textContent = item;

    li.setAttribute('id', item.toLowerCase());

    fragment.appendChild(li);

    return li;

});


ulElement.appendChild(fragment);


ulElement.addEventListener("click",event=>{


    let li =event.target;


    if(li.tagName==='LI'){

        fragment.appendChild(li);

        ulElement.insertBefore(fragment,ulElement.firstElementChild);

    }

});

我覺得這個(gè)方案更好。


查看完整回答
反對(duì) 回復(fù) 2021-09-30
  • 3 回答
  • 0 關(guān)注
  • 185 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購(gòu)課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)