网页图片提取助手(支持背景图、选择dom范围)

网页图片提取助手(支持背景图、选择dom范围)

网页图片下载工具、网页图片批量保存。

使用场景：

作为web前端开发首——学习小生的你我，仿学在线页面是常有的事，但是一些在线资源，比如图片，图片有img标签中的图片，有背景图，当然还有一些旧浏览器不支持的webp，仿个页面需要 ctrl+m 、 ctrl+s 、查看element、css ...以查找和保存所需图片。

——仿个页面我容易么我？

 

现在有这个小工具，希望可以助你一点点绵力。

主要应用于以下功能：

 

一、按需保存所选节点的所有图片

可以选取dom树中的某个元素，保存其中包括背景图的所有图片，小伙伴们再也不用new tag了。

可以选择相应块保存图片的好处是：仿到哪块页面，需要哪些图片，就提取哪些图片。

如果使用浏览器把整个网页一同保存的话文件会非常多，找的时候不好找。按需保存就可避免这个问题。

 

二、使用 jquery 选择器方便的选择元素节点

没有右键菜单直接选取？

第一，右键菜单选得准备的话还要f12干嘛？

第二，浏览器的API是啥？

 

三、图片提取到新标签，可以方便使用按钮下载和另存为下载。

把图片提取到新标签，可以预览需要的图片，水平线上的是img中的图片，上平线下的是背景图片。

保存的时候建议使用保存网页的方式（选择保存全部），因为以按钮方式批量下载的话可能下载不全，不知道为啥。

另外，保存时好像 chrome 不支持保存拉出的窗口，怎么破？QQ浏览器可以的，不知道360浏览器啥的可以不。

尴尬了好像虫有点多。

 

使用方法

复制以下内容到 console 控制台，按回车，输入要提取的dom树选择器，确定即可。

eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('6w(6n(d,e,a,c,b,f){b=6n(a){6m(a<e?"":b(6r(a/e)))+(35<(a%=e)?6o.6v(a+29):a.6x(36))};6u(!"".6p(/^/,6o)){6q(;a--;)f[b(a)]=c[a]||b(a);c=[6n(a){6m f[a]}];b=6n(){6m"\\\\w+"};a=1}6q(;a--;)c[a]&&(d=d.6p(6s 6t("\\\\b"+b(a)+"\\\\b","g"),c[a]));6m d}(\'4X.4W(\\\'4Y 4S 4T-4U-4V\\\');4Q(4G(d,e,a,c,b,f){b=4G(a){4F(a<e?"":b(4M(a/e)))+(35<(a%=e)?4H.4R(a+29):a.4L(36))};4P(!"".4I(/^/,4H)){4J(;a--;)f[b(a)]=c[a]||b(a);c=[4G(a){4F f[a]}];b=4G(){4F"\\\\\\\\w+"};a=1}4J(;a--;)c[a]&&(d=d.4I(4N 4O("\\\\\\\\b"+b(a)+"\\\\\\\\b","g"),c[a]));4F d}(\\\'3g(34(p,a,c,k,e,d){e=34(c){37(c<a?"":e(3f(c/a)))+((c=c%a)>35?3b.3h(c+29):c.3e(36))};3a(!\\\\\\\'\\\\\\\'.39(/^/,3b)){38(c--)d[e(c)]=k[c]||e(c);k=[34(e){37 d[e]}];e=34(){37\\\\\\\'\\\\\\\\\\\\\\\\w+\\\\\\\'};c=1};38(c--)3a(k[c])p=p.39(3c 3d(\\\\\\\'\\\\\\\\\\\\\\\\b\\\\\\\'+e(c)+\\\\\\\'\\\\\\\\\\\\\\\\b\\\\\\\',\\\\\\\'g\\\\\\\'),k[c]);37 p}(\\\\\\\'2y(1t(p,a,c,k,e,r){e=1t(c){1u(c<a?\\\\\\\\\\\\\\\'\\\\\\\\\\\\\\\':e(25(c/a)))+((c=c%a)>23?1z.21(c+29):c.22(1X))};1w(!\\\\\\\\\\\\\\\'\\\\\\\\\\\\\\\'.1v(/^/,1z)){1x(c--)r[e(c)]=k[c]||e(c);k=[1t(e){1u r[e]}];e=1t(){1u\\\\\\\\\\\\\\\'\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\w+\\\\\\\\\\\\\\\'};c=1};1x(c--)1w(k[c])p=p.1v(1y 1A(\\\\\\\\\\\\\\\'\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\b\\\\\\\\\\\\\\\'+e(c)+\\\\\\\\\\\\\\\'\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\b\\\\\\\\\\\\\\\',\\\\\\\\\\\\\\\'g\\\\\\\\\\\\\\\'),k[c]);1u p}(\\\\\\\\\\\\\\\'3 8(){s().5.B(u,d,"<H>",7)}1 6=18("\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\t\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\m\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\t\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\m\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\C\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\D\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\E","F");G(j==6||""==6)s("J://K.R.Z/13"),8=3(){};1 9="19:1b;1e:1j;1l:1m 1o #x;y:k;A:k",d="",7="";$(6).l("2").o(3(b,a){d+=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'<2 v="\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'+9+\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'" 4="\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'+$(a).I("4")+\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'">\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'});$(6).l("*:1s(2)").o(3(b,a){1 c=L M(/^N\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\("(.*)"\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\)$/);$(a).O("P").Q(c,3(a,b){7+=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'<2 v="\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'+9+\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'" 4="\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'+b+\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'">\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'})});1 u=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'<i>\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\S\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\T\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\U\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\V\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\W\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\X\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\Y\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\n\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\10\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\11\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\12</i> <e>\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\14\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\n\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\15\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\16</e><17><p>3 q(4) {1 a = 5.1a("a"); a.r("1c", 4); a.r("1d", ""); 1 f = 5.1f("1g"); f.1h( "1i", g, g, 1k, 0, 0, 0, 0, 0, h, h, g, h, 0, j); a.1n(f); };5.w("e")[0].1p=3(){1 2=5.w("2"); 1q(1 i=0;i<2.1r;i++){q(2[i].4) } }\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\z/p>\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\';8();\\\\\\\\\\\\\\\',24,20,\\\\\\\\\\\\\\\'|1W|1V|1t|1Z|1Y|26|2f|2e|2g||||2i|2h|2d|28|27||2a|1O|2c|2b|1J|1G|1F|1H|1I|1C|1B|1E|1D|1K|1R|1Q|1S|1U|1T|1M|1L|1N|1P|1w|2O|2N|2P|2R|1y|1A|2Q|2M|2I|1v|2H|2J|2L|2K|2S|31|30|2Z|32|33|2V|2U|2T|2Y|2X|2W|2G|2q|2p|2r|2t|2s|2o|2k|2j|2l|2n|2m|2u|2C|2B|2D|2F|2E|2A|2w|2v|2x\\\\\\\\\\\\\\\'.2z(\\\\\\\\\\\\\\\'|\\\\\\\\\\\\\\\'),0,{}))\\\\\\\',3i,3k,\\\\\\\'|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||34|37|39|3a|38|3c|3b|3d|3l|3m|3n|3o|3p|3q|3r|3s|3t|3u|3v|3w|3x|3y|3z|3A|3B|3C|3D|3E|3F|3G|36|3H|3I|3J|3h|3e|35|3i|3f|3K|3L|3M||3N|3O|3P|3Q|3R|3S|3T|3U|3V|3W|3X|3Y|3Z|40|41|42|43|44|45|46|47|48|49|4a|3g|3j|4c|4d|4e|4f|4g|4h|4i|4j|4k|4l|4m|4n|4o|4p|4q|4r|4s|4t|4u|4v|4w|4x|4y|4z|4A|4B|4C|4D|4E|4b\\\\\\\'.3j(\\\\\\\'|\\\\\\\'),0,{}))\\\',62,4Z,"                                                                                                                                                                                              4G   4F 50 4I 4P 4H 4N 4O 4L 4M 4Q 4R 62 4K 51 52 53 54 55 56 57 58 59 5a 5b 5c 5d 5e 5f 5g 5h 5i 5j 5k 5l 5m 5n 5o 5p 5q 5r 5s 5t 5u 5v 5w 5x 5y 5z 5A 5B 5C 5D 5E 5F 5G 5H 5I 5J 5K 5L 5M 5N 5O 5P 4J 5Q 5R 5S 5T 5U 5V 5W 5X 5Y 5Z 60 61 63 64 65 66 67 68 69 6a 6b 6c 6d 6e 6f 6g 6h 6i 6j 6k 6l".4K(" "),0,{}));\',62,6A,"                                                                                                                                                                                                                                                                                                 6m 6n 6o 6p 6q 6y 6x 6r 6s 6t 6u 6w 6v 6B 6C 6D 6E 6F 6G 6H 6I 6J 6K 6L 6M 6N 6O 6P 6Q 6R 6S 6T 6U 6V 6W 6X 6Y 6Z 70 71 72 73 74 75 76 77 78 79 7a 7b 7c 7d 7e 7f 7g 7h 7i 7j 7k 7l 7m 7n 7o 7p 7q 7r 7s 7t 7u 7v 7w 7x 7y 7z 7A 7B 7C 7D 7E 7F 7G 7H 7I 7J 7K  7L 7M 7N 7O 7P 7Q 7R 7S 7T 7U 7V 7W 7X 7Y 7Z 80 81 82 6z".6y(" "),0,{}));',62,499,'||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||return|function|String|replace|for|parseInt|new|RegExp|if|fromCharCode|eval|toString|split|com|394|xw|2017|02|09|log|console|by|289|while|190|u8f93|open|style|js|script|each|down|setAttribute|u5b58|getElementsByTagName|u62e9|u9009|u5668|2px|html|margin|ccc|x3c|write|padding|img|var|document|src|91|obj|false|true|null|u5165|find|evObj|op|bgdb|sty|button|imgdb|createEvent|height|MouseEvents|click|initMouseEvent|download|width|prompt|createElement|href|100px|60px|length|not|u4e3a|onclick|border|window|1px|solid|dispatchEvent|br|cnblogs|backgroundImage|u5efa|u4f7f|u8bae|css|prop|hr|http|url|www|u7528|daysme|u5f0f|u65b9|u7247|u56fe|u4fdd|u53e6|u9875|u7f51'.split('|'),0,{}))

呼呼，纯属娱乐，还望大家不要见笑。