js事件委托

html写基本内容

		<button id="but" type="button">新增</button>
		<ul id="ul">
			<li>1</li>
			<li>2</li>
			<li>3</li>
			<li>4</li>
		</ul>

js实现效果

			var ul = document.getElementById('ul')
			var li = ul.getElementsByTagName('li')
			var but = document.getElementById('but')
			var n = li.length
			but.onclick=function(){
				n++;
				var ll =document.createElement('li');
				ll.innerHTML=n
				ul.appendChild(ll)
			}
			ul.onmouseover=function(e){
				e.target.style.background='red'
			}
			ul.onmouseout=function(e){
				e.target.style.background=''
			}