如何在“查看页面源代码”中找到产生数据的js代码？

Question

有些网页的数据是js输出的，如何才能找到这些js？
比如：

网页地址：http://pubs.rsc.org/en/results?searchtext=Author%3Alingling%20ge

................补充线......................................

右下角红色框内是否为参数？分别为searchterm、resultcount、category、pageno.其中searchterm像数据包，有头有尾的

Answer 1

这个光靠源代码找是不太方便的，用开发者工具可以很容易的找到。
首先，在该网页加载过程中发出的请求中搜索标题，我搜索的是Droplet单词。发现该单词是由'en/search/journalresult'请求的。请求结果中反回了这一块的html。
然后找哪段代码发出的该请求。在js中全局搜索journalresult,找到如下代码：

var resultURL = '/en/search/journalresult';

结下来搜索resultURL，这个结果就比较多了，其中有4处可能是发出该请求的代码，分别在这四处加断点，然后刷新网页。加载时在第一处断点也就是searchresult.js文件的第146行处中断过一次，其它断点未触发。所以可以肯定是该处发出的请求。
查看该处代码，发现是利用$().load()函数请求html后装载如当前页面中。

over

Answer 2

查看网络请求，确定哪个请求获取了你要找的这部分内容

一般来说产生内容方式主要有

1. 页面内联js包含数据，由脚本动态渲染，这种情况，查看源代码搜文本关键字就可以了
2. iframe一个页面，在目标区域右击 -> 查看框架源代码，应该就可以看到了
3. js脚本内包含数据，由脚本动态渲染， 这种情况要找出哪个script请求包含这些数据
4. ajax获取数据 动态渲染，查看哪个XHR请求包含这些数据
5. jsonp获取数据 动态渲染，查看哪个script请求包含这些数据

除了1.2两点可以直接查看源代码，其他都需要查看网络请求，抓包或者直接看控制台的network面板都可以，只是后者不方便搜索

像你这个例子， 右键是没有查看框架源代码选项的，就肯定不是iframe，经过简单的搜索， 就可以找到，它是通过ajax获取的一段html代码