***.forEach is not a function

origin:

	<div id="box">
		<p>city</p>
		<ul id="city">
			<li id="bj">我是第1个孙子</li>
			<li>我是第2个孙子</li>
			<li>我是第3个孙子</li>
			<li>我是第4个孙子</li>
		</ul>
	</div>
	<div id="box_btn">
		<button class="button" id="btn1">获取city所有子节点</button>
		<button class="button" id="btn2">11</button>
		<button class="button" id="btn3">aniu3</button>
	</div>
	
	<script type="text/javascript">
		var btn1 = document.getElementById("btn1");
		btn1.onclick = function(){
    
    
			var city = document.getElementById("city");
			var ci2 = city.childNodes;
			var ci = city.children;
			//手贱：用了forEach()
			ci2.forEach(function(a){
    
    
				alert(a.innerHTML);
			});
			ci.forEach(function(a){
    
    
				alert(a.innerHTML);
			});

error:
	元素子节点.html:60 Uncaught TypeError: ci.forEach is not a function
    at HTMLButtonElement.btn1.onclick (元素子节点.html:60)

The DOM collection obtained by native js is an array-like object. You cannot directly use array methods
(such as forEach, map, etc.). You need to convert to an array before you can use the array method!

1. Recommend several methods to convert to an array

1.1 Array.from()

let lis = Array.from(ci);

1.2 [… there]

let lis = [...ci];

1.3 Array.prototype.slice.call（ci）

let lis = Array.prototype.slice.call（ci）;