有没有审查元素审查玩的厉害的大神,教我怎么一件去除漫画页数分割。如图

: 重写引言;新增目录;更新1-5的文芓及配图
Firefox 浏览器是很多人心中的经典。除了从NetScape开始的传奇色彩、对抗IE的英雄形象之外在技术方面,Firefox 最被人称道的就是极为丰富的扩展、极强的定制性只要愿意花时间,用户可以打造出完全符合自己需求、具备无限功能的 Firefox 但Chrome出现后,凭着“简洁、快速”的核心优势加上Google的强势更新和推广,在市场份额方面持续提升当功能实现后,对 Firefox 的压力更大拥向 Chrome 的,不但有大量的IE用户也包括很多资深 Firefox 用户。 Chrome 現在能否超越 Firefox 呢国外网站在2010年2月称:通过20条技巧,就可以让Chrome更加强大从而超越和替代

尽管我自己也是从 Firefox 转向 Chrome ,但并不代表就完全赞同該文的观点也不赞同简单比较、定分高下的做法。不过从 Chrome 应用技巧来看,该文也有很高水平故于2010年3月组织翻译,并于2010年11月陆续修正囷更新

要快速删除地址栏下拉菜单中的特定浏览记录,先高亮选中项然后按 Shift+Delete
要选择在下拉菜单中的第一个或最后一个项目只需要按Page UpPage Down即可。

这里只是列举了部分可以在Chrome(和Windows)中使用的快捷键至于完整的快捷键列表,请参阅谷歌的 其中还列出了适用于Mac和Linux用户的快捷键。

也会提示“按tag键搜索”此时按下tab,再输入关键词并回车就相当于在善用佳软进行搜索了。动画示意见下图:


要想更快的话可鉯自定义每个搜索引擎的关键字。例如要创建,如果已存在高亮选择并单击“修改”;如不存在,单击“添加”按钮

我们要创建一個关键字,告诉Chrome用谷歌搜索/search?q=%s+site:的内容这样只要在Chrome地址栏中键入 mpc 并按下Tab键,再输入关键词即可

别急,还有更精彩的!我们可以用类似的方法设置一个自己的搜索引擎我们将再次使用/search/node/Intel 。复制该网址到剪贴板接下来,右击Omnibar地址栏并选择修改搜索引擎单击添加按钮,填写相應的名称、关键字、网址注意在网址中用%s 替换搜索字词('Intel')。各文本框看起来应该是这样:

如果你经常使用谷歌图片搜索这个小技巧鈳以节省大量的时间。只要使用以下网址来创建自定义搜索引擎:

***AdBlock扩展为浏览器按钮之后,(
)你可以点击图标,选择“不要在這个域中运行”好了,现在我们换个话题让我们将注意力转向NoScript。NoScript有点不同因为它对潜在的恶意(或者只是恼人的)JavaScript代码提供了一个額外保护层。它是Firefox用户的最爱之一但Chrome上不可用。
这是个坏消息好消息是你仍然可以在Chrome上实现NoScript的效果,但你必须使用开发版本(目前是5.0.xxx.x)它并不华丽,但很有效当你***了开发版本(下载
),重启浏览器进入工具>选项,选择“高级设置”标签在“隐私权”下,单擊“内容设置”按钮
点击JavaScript标签,然后点击“不要让任何网站运行JavaScript”按钮这将阻止执行所有JavaScript,但如果有某些网站要允许请点击“例外”按钮,手动输入或者你也可以允许JavaScript运行,然后建立黑名单输入网址并从下拉菜单中选择“禁用”。在这里你还可以在其他各标签中控制图像插件,弹出窗口和cookies并调整设置。

19. 通过页面分割视图比较网页

标签式浏览是自从……呃自从有这种浏览方式以来最伟大的事凊。但如果你在同一时间查看两个网站你必须打开另一个窗口。或者你可以在两个标签之间反复切换。这都不是理想方案
现在宽屏顯示器已经非常普及,但不知道为何分屏浏览功能尚未被所有主要浏览器制造商采用浏览器制造商步伐缓慢,但你可以自行添加书签项
将你的浏览器分割为两个带独立网址栏的页面。这不是一个完美解决方案——像新蛋之类的网站仍会占据整个屏幕——但这是我们现茬的最好选择,除非浏览器制造商解决这个问题

有三种方式让你随身携带Chrome:
  2.购买笔记本电脑或上网本
第三种选择最适合把chrome装进口袋,起码看起来不那么傻它也不会占用太多U盘空间,约35MB
只要点击以上链接,下载和“***”这个应用程序***过程实际只是解压缩,伱可以将其释放到桌面然后将文件夹移至U盘,也可直接解压缩到你的U盘完成后即可打开便携式Chrome开始浏览!(完)>

本文汇总记录Google Chrome浏览器嘚更新情况。此外重大更新会有专文介绍;另可参见《》。

* 自动滚屏网页任意位置点鼠标中键即可。
* 个人配置:可将工作配置(首页、书签、浏览历史……)与娱乐配置分开切换无须重启。

(谷歌浏览器)是 Google 基于WebKit核心开发的浏览器既是2008年Google的一件重大举措,也是软件業的重大事件Google Chrome 最大的优点是:快速、安全、稳定。Chrome于2008年9月2日在全球同步发布;12月12日发布v1.0正式版;目前最新版为v2.0 pre

(2):此网址的 chromium-rel-xp 子目錄中包含所有build,因此打开速度会比较慢建议的做法是,然后直接进入 得到的是官方免***版本。[]
(4)搜索Chrome下载便携版。

:北京时间2008姩9月3日凌晨2点50左右Google如约正式发布了Chrome浏览器测试版,并在全球100多个国家同步推出本地化语言的版本搜狐IT在第一时间下载了简体中文版并進行了试用。

请访问网站支持多语言。多数情况下能根据浏览器的设定自动跳转到简体中文(比如善用佳软的Firefox 3)。如果没能跳转可通过右上角下拉框中的“简体中文”则跳转到简体中文界面。也可以直接访问中文页面url:

可以看到Google中国并没有为Chrome起什么本地化的名字,呮是简单的称作“谷歌浏览器”其宣传语也非常的简单:谷歌浏览器是一款可让您更快速、轻松且安全地使用网络的浏览器,它的设计超级简洁使用起来更加方便。【xbeta补:google 这次好象很低调倒是大量用户和其他网站卖力宣传!】

选择好合适的语言版本后,会跳转向“谷謌浏览器服务条款”页面

在服务条款里首先明确了浏览器代码遵守开源软件许可协议。此外还有一个可选项是否“将使用统计信息和崩溃报告自动发送给 Google,帮助我们完善谷歌浏览器”按照Google的解释,是可让 Google Chrome 自动将使用统计信息和崩溃报告发送给 Google这个设置也可以在后面掱工关闭。【xbeta补:我选中了】

选择“接受并***”后首先会下载一个约500KB(视版本略有差异)的***包,这只是一个引导***文件运行後会自动下载所需的***文件,根据网络环境不同所需时间也不同如果你需要代理服务器+用户名/密码上网,则很可能无法***解决办法:寻找官方的独立***包,或第3方提供的便携版本目前Chrome浏览器仅支持Windows XP和Windows Vista。据称面向Linux和苹果Mac OS X系统的产品正在开发中

***完成后,就准備第一次启动Chrome对话框会提示:将导入默认浏览器的设置(浏览历史记录、已保存的网站和密码),以及在桌面添加快捷方式等(如图)如果你想更改这些默认设定,可点击“自定义这些设置”从而手工指定导入来源和内容(如图)。目前导入来源支持Firefox 或 Internet Explorer、Google Toolbar; 似乎不支歭相同内核的 Safari(?)另发现,不能导入Portable Firefox的设置——这一点可以理解但也可以改进,由用户手工指定目录导入

其实,也可以使用Chrome的过程Φ再从这些浏览器手动导入信息(如下图)。

然后点击“启动谷歌浏览器”按钮就可以看到其庐山真面目了。

Google Chrome启动(速度很快)后鈳以看到其界面非常简洁,除了标签栏、地址栏和一些按钮之外没有任何多余的元素审查。这也非常符合Google的一贯风格

下面我们就来一┅为你介绍Chrome浏览器的一些特性和功能。

在Chrome中地址栏位于常规浏览器窗口上方,一框多用除了可当作地址栏外,还可以当搜索框使用還可以用它为网站添加书签,并通过它了解网站的安全性只要在地址栏中输入关键字,它就会根据您所输入的信息就相关查询和热门网站自动提出建议这里默认使用的是Google Suggest服务。

在地址栏中输入网址按回车键,或点击箭头图标就可以打开网页在键入的同时,Chrome浏览器也會自动搜索你的浏览历史记录并在下拉菜单底部显示相匹配结果的总数。
打开网页后点击浏览器工具栏上的星标,可以创建书签

4. 多標签页/多窗口/多配置

Chrome可以同时运行多个窗口,在V2.0中更支持不同窗口以不同profile运行。每个窗口可以包含多个Tab每个Tab不仅可以在当前窗口拖动排序,还可以拖到其他窗口或拖出为独立窗口。此外Chrome浏览器的标签页是一种梯形,与其他浏览器不同

鼠标方式:点击最后一个标签頁旁边的 + 图标。热键方式:Ctrl+T
Chrome会自动记录你经常访问的网站,显示在“新标签页”中并提供这些网站的缩略图和链接。除此之外还显礻快速搜索历史记录、最近的书签、最近关闭的标签页等常用链接。点击网页底部的“显示全部历史记录”链接可查看保存在浏览器上嘚完整浏览历史记录。

如下图所示Ctrl+N 打开新窗口;Ctrl+shift+n 打开隐身窗口;且v2.0开始提供新窗口运行不同设定(比如密码、收藏夹等。相当于多个绿銫的Chrome)

从外观看Chrome的多标签与传统的多标签布局有很大不同。比如IE7.0 或 Firefox 或 Maxthon 的多标签是共用一个地址栏和按钮。而Chrome则每一标签功能完整,洳图
从内在技术来看,这种机制下的各tab是相互独立的也就是说,当一个tab占用资源过高或崩溃时不会影响其他tab。这对大量访问网页的鼡户而言明显提高了稳定性和可用性。这种各tab独立进程的机制也被 IE8 所采用

(以上部分已于更新,但本节仍会有待重写更条理化解释)

5. 网络应用程序: 应用程序快捷方式

实际上,许多网站(如电子邮件服务)与计算机桌面上的实际程序有非常相似的操作方式Google认为完全可鉯像打开计算机上的任何其他程序一样打开这些网站。在Chrome浏览器中可为网络应用程序创建快捷方式【xbeta补:本地和网络,日益统一lihaominster在小眾留言:其实,这次有个很低调的功能大家可能还没注意到打开页面比如gmail后,在菜单里有个“创建应用程序快捷方式”可以为gmail邮箱创建一个本地桌面快捷方式,关掉浏览器打开这个快捷方式,窗口除了gmail的信箱外什么也没有没有地址栏、返回按钮、收藏夹等等。换个概念的话我要说这不起眼的功能,加上google gear基本就是个本地邮件客户端了。我想google chrome目前只是google在本地桌面应用的一次试水后招才是他们真正想干的,嘿嘿】

点击“网页”菜单选择“创建应用程序快捷方式”。在”Google Gears”对话框中选择要在放置快捷方式的位置的复选框。
图:创建快捷方式:例如我们在桌面创建了一个Gmail的应用程序快截方式。

双击快捷方式图标时网络应用程序就会在一个专门的精简窗口中打开,没有地址栏和标签页以尽可能提供更多的工作空间。【xbeta补:就这样一点一点改进】

现在大部分用户都会用到多窗口浏览的功能,如果遇到某个网页不正常往往会导致整个浏览器假死甚至崩溃在Chrome浏览器中,所使用的各个标签页都在浏览器中独立运行因此,即使某一個应用程序崩溃也不会影响到其他任何进程。【xbeta补:已经有网友经历过了】

可使用任务管理器中查看Google Chrome 中所运行的特定进程的详细信息,或强行关闭行为不正常的标签页或应用程序

点击“网页”菜单,选择“开发人员”选择“任务管理器”。也可使用键盘快捷键 Shift+Esc 快速咑开任务管理器
【:左下角的“傻瓜统计信息”真是超囧,点击打开原来是各个浏览器、标签的内存占用情况。这个统计页面可以通過在地址栏输入“about:memory”直达有趣的是,该统计信息可以显示当前打开的所有浏览器的内存占用( If

在任务管理器中可监控 Chrome 中每个活动项目嘚内存使用量、CPU 使用率以及网络活动(已发送和已接收的字节数)。

要强行关闭 Chrome 中行为不正常的网页或应用程序选中该网页,然后点击結束进程按钮
点击结束进程按钮后,所有相关联的标签页都会显示“喔唷崩溃啦!”的消息。

在IE8 中出现了一种保护浏览隐私的模式被戏称为“***模式”。在Chrome中也出现了该功能称作“隐身模式”。如果不希望访问过的页面显示在网络历史记录中选择隐身模式即可隱身浏览。

隐身状态时所打开的网页不会记录在浏览历史记录中所有新的 Cookie 都会在关闭隐身窗口后删除。可使用不同的窗口同时进行正瑺浏览和隐身访问。【xbeta补:这是安全的一方面体现:保护隐私不被泄露】

【xbeta补:这是安全的另一方面,保护自己的内容不被侵害】如果您要访问的网站被怀疑存在网络欺诈、恶意软件或其他不安全因素,谷歌浏览器会向您发出警告

当您连接到一个使用 SSL 传输数据的网站時,托管该网站的服务器会向谷歌浏览器和其他浏览器提供***以验证其身份 该***包含类似于网站地址的信息,这些信息已由第三方機构确认 通过检查***中的地址是否与网站地址相符,大致可以认定您是在与***上的网站进行通信而不是与伪装成该网站的网站进荇通信。
图:安全验证:这样可以防止网络钓鱼事件或者恶意软件的攻击【xbeta补:Firefox 3 在这方面很好。】

在Chrome浏览器中下载文件时并不会弹出丅载管理器;可以在当前窗口底部查看下载状态,非常的方便

文件按钮会显示剩余下载时间。 标签页上会出现绿色箭头表示正在下载。

Chrome浏览器在设置方面也同样是非常的简单
“基本信息”选项中可以设置启动页、主页、默认搜索和默认浏览器。

“中级用户选项”中可鉯设置下载位置、密码、字体和语言

“高级选项”中可以对网络、安全等方面进行设置。
【xbeta补:这种对不同用户分级的设置方式算是┅个不错的小创新】

我们很奇怪的发现,当打开会有两个Chrome.exe进程共占用32MB左右的内存。当打开更多的标签页之后会启动更多的进程。【xbeta补:奇怪吗前面不是说了,多tab互相独立各为进程嘛。】


图:未打开任何标签页的资源占用情况


图:打开两个标签页后的资源占用情况
我們猜测这可能和Chrome浏览器的防崩溃机制有关。【xbeta补:猜对了IE8的用户也可以看一下IE进程。】

Acid2浏览器测试是为考量一个浏览器与现有的网页標准的兼容程度Chrome进行Acid2测试没任何问题,顺利通过

接下来看看更为严格的最新Acid3标准测试。Chrome的Acid3测试得分为77分显示上和标准有所差距,看來还必须多加努力
【xbeta补:这是测试对标准规范的支持程度,不是测试对“不规范”的兼容另外,这种测试对普通用户的意义不大】

國内用户会经常使用的弹出窗口拦截和广告过滤功能,在Chrome浏览器中也简单提供了弹出窗口拦截功能

和Firefox等非IE内核浏览器一样,Chrome浏览器不支歭网上银行【xbeta补:网上银行不支持非IE浏览器——这一局面早晚会有改变的】

通过简单的试用,我们感觉Chrome浏览器在易用性方面做的比较出銫界面简洁,上手也非常容易不需要过多的设置。在本地化方面做的还不够细致例如在界面中经常出现个别的繁体词语。对于习惯叻很多繁杂按钮、工具栏的用户来说Chrome浏览器给人耳目一新的感觉。但能否被广大的用户所接受还需要时间的检验。Google在这方面有过失败嘚案例Google Talk当年问世时也是众人关注,但是现在已经沦为“鸡肋”产品

毕竟,用户需要的是实实在在的满足其个性化需求的服务和功能洏不是概念。

【xbeta的总结:对于喜欢尝试新软件的用户Google Chrome当然不可不试;对于追求浏览器完美体验的用户,没必要从现在的成熟浏览器转向Chrome;但所有人都可以关注它的进展因为它不仅会改变浏览器领域的格局,也会影响新版本的Firefox/Opera/IE/Safari也会影响网页设计人员(包括网银)在规范性方面的考虑。对于Google其他服务的深度用户或许能期望Chrome在未来的更好集成。】

(责任编辑:韩建光以上转自 ,由xbeta进行补充点评)

很多时候峩们希望复制/粘贴时仅针对纯文字,而不要格式Firefox 为此还有一款扩展。在 Chrome 中只须 ctrl+shift+v 即可。()

李二嫂的猪:多行文本框用它竟然可以拖动妀变大小……小众如此、饭否如此……

:Google chrome 的右键菜单中有个审查元素审查的功能打开后,鼠标滑过html代码可以高亮显示某个 div 块,对网络開发人员来说是很有用的有点像 firefox web developer 扩展的功能,不过比那个应该简单的多
:在页面中点击右键,选择“审查元素审查”(好像翻译的不呔好)就可以以DOM树的方式浏览页面的元素审查,界面和Firebug很相像

:刚刚装上,还没怎么用说一下大概印象,整体非常简洁只有两个菜单选项。访问上明显感觉很快比 Firefox 快,也比 IE7快;对网页的支持没发现什么问题随便访问了几个网站,并测试了一下 js 很多的网站一切囸常,没发现 bug.***后首次启用的时候会自动导入 Firefox 的书签等个人内容包括保存的密码都全部导入。
全屏显示的时候左边和底部没有边框這一点和 Safari 差不多。
状态栏在网页加载的时候显示加载完毕后自动消失。



有时事情本身比较简单按微言大义詓理解或趣解也是可以的,但并非创作者的本意

首先,官方漫画书中指出:每个浏览器框架就称为chrome
其次,善用佳软于2009年1月6日与Chrome在国内嘚开发团队成员访谈中也确认过与铬无关,并于7日得到书面邮件确认如下:

……谢谢你的采访这是我所能提供的***:
1. Chrome的命名:它来源于浏览器的图形用户界面框(界面框本身叫做Chrome);
2. Chrome的Logo: 并无特殊寓意。只是使用Google Logo 的四个色彩表示它可以连接Google所有产品;并且它的形状既像O又潒G;

Chrome名称的趣解/误解:

Chrome,化学里称之为“铬”铬是第24号元素审查,原子量为52铬的名称来自希腊文 Chroma,意为颜色因为铬元素审查以多种不哃颜色的化合物存在,故被称为“多彩的元素审查”此外, 铬在人体的总量约为6毫克它分布在人体各部,血清中的铬浓度约在5—10微克/毫升铬的浓度随年龄增加而减少。随着体内铬的减少衰老也逐渐发生,因此体内铬若能维持到一定水平就会使你青春常在,所以姒可称为“葆你青春的铬”……那么,Google 取名还是有点味道想让浏览器一直那么的快速、便捷和稳定。

而关于Chrome Logo有更多国内外文章来证奣它借鉴或来自某些设计(Thinkfree Office, QQ, Simon and Pokemon……),但都可信度不大也就不再引用了。其中最有趣的“发现”是:Chrome Logo是蹂躏微软Logo而成,如下图:

附:Google 官方博客声明

我们通过漫画形式提前发布了一款开源浏览器Google Chrome相信大家已经通过博客渠道了解到该消息。周二我们将在全球100多个国家推出Google Chrome測试版。

为什么要开发Google Chrome呢因为我们相信它能给用户带来更多价值,同时有利于推动Web创新

在谷歌,大量的工作都是通过浏览器进行的搜索、聊天、收发邮件和协同开发等。在空闲时间我们通过浏览器购物,登录网络银行读新闻,与好友交流 等每天花费在浏览器上嘚时间如此之多,我们不得不考虑什么样的浏览器最适合当前的Web发展趋势如今,网页已经从简单的文本页面发展到富媒体页面这 就需偠我们重新设计网络浏览器。我们真正需要的不仅仅是一款浏览器而是一个现代化的网页及应用平台。这就是我们开发Google Chrome的初衷

从外观即可看出,Google Chrome的设计简单、高效是一款真正的Web浏览工具。与谷歌主页一样Google Chrome的特点是简洁、快速。

Google Chrome支持多标签浏览每个标签页面都在独竝的”沙箱”内运行,在提高安全性的同时一个标签页面的崩溃也不会导致其他标签页面被关闭。Google Chrome基于更强大的JavaScript V8引擎这是当前Web浏览器所无法实现的。

当然这只是一个开始,Google Chrome在很多方面还需要进一步完善此次,我们即将推出的是Windows下的测试版本供大家讨论,我们也希朢能够得到用户的反馈目前, Mac和Linux版本尚在开发之中同样将秉承快速、高效的特点。

Google Chrome是一款开源软件借鉴了苹果的WebKit、Mozilla的Firefox及其他相关应鼡。同样我们也将开放Google Chrome的全部源代码。我们期望与整个开源社区合作共同推动Web创新。

在当前Web市场选择和创新越来越多,我们希望Google Chrome能荿为一个新选择推动Web服务更上一层楼。

小喵的唠叨话:这次的博客讲嘚是使用python编写一个爬虫工具。为什么要写这个爬虫呢原因是小喵在看完《极黑的布伦希尔特》这个动画之后,又想看看漫画结果发现各大APP都没有资源,最终好不容易找到一个网站可以看但是由于网速太渣,看起来额外的费劲这时候如果能提前下载下来就好了。

原因僦是这样作为技术喵,任何问题都不能阻碍一颗爱漫画的心所以问题就来了,挖掘机技修哪家强

在bing上搜索Python、爬虫框架。找到大家常鼡的框架

Scrapy似乎是个很不错的选择。至于相对于其他框架的优点小喵没有细查,至少这个框架是之前听过的但是在实现的时候发现有┅些问题,scrapy不能直接抓取动态的页面小喵需要抓取的网站的漫画都是使用Ajax生成的。需要自己分析各种数据这个有点麻烦。

那么有没有鈳以渲染页面的工具呢像浏览器一样的?有

,可以理解是一个浏览器不过它没有界面,我们可以通过js的代码模拟用户的行为这就偠求了解它的api并有js基础了。

这是个浏览器自动化测试框架。它依赖于浏览器(这个浏览器也可以是PhantomJs)通过Selenium可以模拟用户的行为。而且囿Python接口所以相对简单一些。

哟这个爬虫软件应该有个响当当的名字。。就叫漫画喵吧英文名Cartoon Cat

下面我们一点点的介绍这个爬虫的實现过程吧

小喵这里选用Python作为开发语言,框架是selenium原因是python经常用来写爬虫,selenium可以用来模拟用户行为PhantomJs是可选的,不过小喵最终会在一个垺务器上运行所以也是需要的。

为了不影响本机上的python我们还需要使用virtualenv来创建一个独立的python环境。具体步骤如下:

virtualenv是一个常用的用来创建python環境的工具小喵用这个有两个原因,一是为了不污染本机的环境二是在本机直接***库的时候出了一个权限的问题。

virtualenv的***十分简单使用pip工具就可以***。

待程序执行结束你就会开心的发现自己已经有了virtualenv这个工具了。

执行完第一个指令后就会创建成功一个python环境,執行第二个指令后就会发现命令行的起始位置有变化。这时候python、pip等工具就变成使用这个新环境的了当然也可以使用which python来查看。

进入新环境后pip***的依赖库都会在新环境中***,不会影响主机自身的python使用pip ***selenium:

至此,我们的基本环境就搭建完了

这个只在从官网上下载僦可以:

小喵的本地实验环境是Mac,所以下载了Mac版本解压之后就可以使用。

小喵想看的这个漫画貌似各大网站都没有资源在费了九牛二虤之力后,终于找到了一个网站!

每个网站的结构都不相同,因此都需要定制一套爬虫程序本文的爬虫就只能针对这个漫画网站使用,喵粉们需要爬其他网站的话需要自己做相应的修改。

这里需要解析两个页面一个是漫画的首页,比如前面的:

另一个就是具体章节嘚页面

为了减小图片的大小,小喵把窗口做了缩放首页大致是这个样子。

各类信息十分的明了我们关注的就是下面的漫画列表。通過Chrome强大的审查元素审查的功能我们立刻就能定位到章节的位置。(对着感兴趣的位置->右键->审查 就能找到)

可以看到章节所在的区域的idplay_0,学过前端的童鞋都应该知道一个页面中id通常唯一标示一个节点。因此如果我们能够获取这个页面的话查找idplay_0的节点就能一下子缩尛搜索范围。

而每个章节的信息都是一个a标签标签的href是对应章节的具体网址,标签的文本部分是章节名这样相对关系就得出了:div#play_0 > ul > li > a

首頁的分析就到此结束

我们随意打开一个具体章节的页面。比如:

引入眼帘的是一个很干净的页面(简直是漫画界的清流好多漫画网站仩全部是广告)。

咦我们的右键怎么按不了?

其实呢这个现象在小说网站上遇到的机会会更多。当我们看到比较优美的文字或是炫酷嘚图片都会下意识的选中->右键->保存。而很多时候这些资源都是有版权的。并不应该随意的传播(狠狠的打了自己的脸/(ㄒoㄒ)/~~)因此限淛鼠标右键会是一个很简单却有效的办法。

那么我们如何绕过这个陷阱呢

很简单,我们不用右键即可打开浏览器的开发者工具选项,找到elements这个选项可以看到一个复杂的结构(其实和上面审查元素审查之后的结果一样)。之后不断的选中标签当标签被选中时,左侧页媔中对应的位置会有蓝色多试几次,最终就能找到对应的位置

这是一个img标签,对应的idqTcms_pic这样找到这个id,就能找到这个img标签根据src就能找到图片的具体URI地址。

接下来是找到下一张图片的地址这时候需要查看下一页这个按钮的内容。用相同的方法很容易定位成功。

小喵本来是用scrapy来做爬虫的看到这里的时候就果断放弃了。我们分析一下选中的a标签的代码如下:

比较简单的网站,“下一页”可以用真嘚a标签和href属性来做这样的好处是实现比较简单,坏处是一旦得到网页源码就能很容易的解析而像scrapy这样的爬虫工具只能抓取静态的代码(动态的需要自己分析ajax,有点麻烦)而显然这里的页面是动态的,使用了ajax来实现所以光是得到网页源码并不能真的得到图片,而是必須让其中的js代码运行才可以所以我们才需要使用浏览器或者PhantomJs这样的可以执行js代码的工具。

上面的a标签的代码告诉了我们很多信息首先昰告诉了我们,这个节点的位置通过next这个类名可以方便的找到该节点(其实有两个类名为next的按钮,另一个在下面但是功能都一样)。其次当这个按钮被点击时会调用:a_f_qTcms_Pic_nextUrl_Href()这个js函数。难道我们需要再研究这个函数

不用。因为PhantomJs的角色就是一个浏览器我们只需要向真正的鼡户一样点击一下这个next按钮,就会进入下一个页面/* 感受到这个工具的强大了吗? */

最后一个问题就是如何判断这个章节结束了?

我们跳箌章节的最后一页然后再次点击“下一页”,这时候会出现一个弹窗

多次试验之后,我们会发现只有在最后一页的时候才会弹出这個弹窗,这样的话我们每抓取完一页,点击一次“下一页”判断有无弹窗就知道是不是最后一页了。在右侧的开发者工具中我们能够看到这个弹窗是一个idmsgDivdiv(而且它的出现和消失是通过增减节点来实现的,另一种实现方法是将display设成noneblock这种情况可以根据display的属性来判斷)。所以我们判断这个节点存不存在就行了

至此,两种页面的解析都完成了下一步就开始我们的代码实现吧。

至此漫画喵的设计思路和主要的代码实现都介绍完了。上面的代码只是用来示意小喵自己下载漫画用的代码是另一套。github的地址是: 项目只有100多行。不过吔用了小喵不少的一段时间

博客写完了~小喵的漫画也下完了~

参考资料

 

随机推荐