这个小图标的功能叫”逐语句执行“或者叫”逐步执行“，这是我个人理解的一个叫法，意思就是，每点击它一次，js语句就会往后执行一句，它还有一个快捷键，F10。下图示范一下它被点击以后的效果：
我单击了两次这个按钮（或者使用F10快捷键），js代码从227行执行到了229行，所以我管它叫”逐语句执行“或者”逐步执行“。这个功能非常的实用，大部分的调试都会使用到它。
太晚了，明天继续写，好戏还在后头~
——————————————————————分割线————————————————————
OK，接着写！
上面介绍到我单击了两次“逐语句执行”按钮，代码从227行运行到229行，大家觉得这意味着啥？是不是说明从语法上来说，前两句是没有问题的，那么是不是也同时意味着前两句就排除嫌疑了呢？我看不然。
大家都知道，加载更多就是一个下一页的功能，而其中最核心的一个就是传给后台的页码数值，每当我点击加载更多按钮一次，页码的数值就要加1，所以如果下一页的数据没出来，是不是有可能是因为页码数值也就是[i变量]（下面统一称呼i）有问题？那么如何排查页码是否存在问题呢？大家自己先思考思考。
下面教大家两种查看页码数值i]实际输出值的方法，上图：
第一种：
操作步骤如下：
1.仍然是在227行打上断点 → 2. 点击加载更多按钮 → 3. 单击一次“逐语句执行“按钮，js代码执行到228行 → 4.用鼠标选中i++（什么叫选中大家里不理解？就是你要复制一个东西，是不是要选中它？对，就是这个选中） → 5. 选中以后，鼠标悬浮在目标上方，你就看到上图的结果。
第二种：
这个方法其实和第一种差不多，只不过是在控制台输出i的值，大家只需要按照第一种方法执行到第三步 → 4. 打开和sources同一级栏目的console → 5. 在console下方的输入栏里输入i → 6. 按enter回车键即可。
上面的第二种方法里，提到了console这个东西，我们可以称呼它为控制台或者其他什么都可以，这不重要~console的功能很强大，在调试的过程中，我们往往需要知道某些变量的值到底输出了什么，或者我们使用选择器[$”.div”)这种]是否选中了我们想要的元素等，都可以在控制台打印出来。当然直接用第一种方法也可以。
给大家示范一下在console里打印我们想要选中的元素。上图~
在控制台中输入$(this)，即可得到选择的元素，没错，正是我们所点击的对象——加载更多按钮元素。
在这里给大家说说我对console这个控制台的理解：这个东东就是一个js解析器，是浏览器本身用来解析运行js的家伙，只不过浏览器通过console让我们开发者在调试过程中，可以控制js的运行以及输出。通过上面的两种方法，大家可能觉得使用起来很简单，但是我要给大家提醒一下，或者说是一些新手比较容易遇到的困惑。
困惑一：在没有打断点的情况下，在console输入i，结果console报错了。
这应该是新手很常见的问题，为什么不打断点我就没有办法在控制台直接输出变量的值呢？个人理解这时候i只是一个局部变量，如果不打上断点，浏览器会把所有的js全部解析完成，console并不能访问到局部变量，只能访问到全局变量，所以这时候console会报错i未定义，但是当js打上断点时，console解析到了局部变量i所在的函数内，这时候i是能够被访问的。
困惑二：为什么我直接在console里输入$(“.xxx”)能打印出东西来呢？
很简单，console本身就是一个js解析器，$(“.xxx”)就是一个js语句，所以自然console能够解析这个语句然后输出结果。
介绍完“逐语句执行”按钮和console控制台的用法，最后再介绍一个按钮，上图：