DOM映射机制

<ul id="ul1">
    <li>01</li>
    <li>02</li>
    <li>03</li>
</ul>
<script>
  var oUl = document.getElementById('ul1');
  var oLis = oUl.getElementsByTagName('li');
  console.log(oLis.length);  // -> 3
  var oLi = document.createElement('li');
  oUl.appendChild(oLi);
  console.log(oLis.length);  //  -> 5
</script>

没有重新获取，但是oLis这个集合的长度跟着内容自动发生了改变
DOM的映射机制：页面中的标签和JS中获取到的元素对象(元素集合)是紧紧绑定在一起的，页面中的HTML结构发生改变，JS中不需要重新获取，集合里面的内容也会跟着自动改变