JS 原型链随笔（二）

第一篇回顾了原型的5条规则。但是在刚开始我coding中很少用到它们，因为都习惯了用一些库来直接构建项目。今天我想通过实战来简单学习下原型规则。

上面的截图就是简书的首页。当前选择的是body标签。下面有三种方法选择出body中的html.

第一种只能用在console中，用$0.innerHTML，$0表示当前选择的标签元素。

第二种根据上面的截图，我们只看见了class信息，用document.getElementsByClassName('reader-black-font')[0].innerHTML同样可以取出html信息。这里我们取第一个元素，因为body元素肯定位于第一个。

第三种用div1.html()取出inner html。咦? div1.html()是什么，我怎么没见过。看下面的截图，这是我包装出来的方法，第三种方式代表着那些第三方库给我们提供的特别好用的方法，但是往往我们没有考虑过它们是如何做到的。完整代码就是下图中是上面的部分。

这里就是利用的原型规则，来实现了jquery中常见的一些方法。当然这只是最简单的例子，jquery中做了更多场景的适配。这里还有两个小知识点，return this是为了链式调用。而val有值的话，则会改变页面。如我写div1.html('<div>简书，你好</div>')。

则页面从简书首页变成下图。