JS 事件代理

<ul id="list">
            <li>这是第一项</li>
            <li>这是第二项</li>
            <li>这是第三项</li>
            <button type="button" id="btn">按钮</button>
</ul>

const list = document.getElementById(‘list‘)
const lis = document.getElementsByTagName(‘li‘)
const button = document.getElementById(‘btn‘)

function addEvent(elem, type, fn) {
    elem.addEventListener(type, fn)
}

// lisArray = Array.prototype.slice.call(lis);
// console.log(lisArray)

addEvent(list, ‘click‘, (e)=>{
    const target = e.target;
    if(target.nodeName === ‘LI‘){
        console.log(target)
    }
})

button.addEventListener(‘click‘, ()=>{
    const li = document.createElement(‘li‘);
    li.innerHTML = ‘新增内容‘;
    list.insertBefore(li, button)
})