给 Chrome浏览器 添加 Javascript小书签，查看当前页面全部加载的javascript文件及代码片段

小书签又名 Bookmarklet，由英文单词 Bookmark 和 Applet 组合而来。简单地说，小书签就是把一段带有特定功能的 JavaScript 代码保存至收藏夹，当你需要的时候点击它来实现这段 JavaScript 代码的功能。

1.chrome浏览器中打开一个空白的页面，输入  chrome://bookmarks/#1，打开书签管理器

2.在书签管理器的左侧，选择 “书签栏 ”文件夹，如下图

  

3.点击书签管理器顶部右上角的3个小点（提示信息：整理）按钮，弹出一个菜单

，

4.在弹出的菜单中，选择“添加书签”，弹出下图的添加书签对话框

a. 名称文本框输入小书签名称，比如：Print Script

b. 网址文本框中，输入下面这一段javascript：

javascript:(function(){var scriptarr=document.getElementsByTagName("script");for(idxout in scriptarr){ if(scriptarr[idxout].src=="") { console.log("*-*-*-*- 来自页面上的script标签的代码片段 *-*-*-");console.log("outHTML"," : ",scriptarr[idxout]["outerHTML"]);} else { console.log("*-*-*- 来自页面页面上引用的script文件：",scriptarr[idxout].src," *-*-*-"); continue; }}})();

或者

javascript:var scriptarray=document.getElementsByTagName("script");for(scriptindex in scriptarray){console.log(scriptarray[scriptindex])};

  

3.点击"保存"按钮。

完成小书签的创建，在需要的网页页面，打开控制台（快捷键：ctrl+shift+i）,单击该书签，就可以在控制台中看到打印出的所有引用的脚本文件及脚本块内容啦