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


有些网页的数据是js输出的,如何才能找到这些js?
比如:
图片描述

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

................补充线......................................
图片描述

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

jquery-ajax JavaScript

法老控D轨迹 11 years, 3 months ago

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

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

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

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

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

图片描述

Olivier answered 11 years, 3 months ago

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


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

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

over

莉莉丝七重奏 answered 11 years, 3 months ago

Your Answer