<?xml version="1.0" encoding="utf-8" standalone="yes"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
    <channel>
        <title>Chrome on ZRJ | 学习笔记</title>
        <link>https://blog.zrj.me/tags/chrome/</link>
        <description>Recent content in Chrome on ZRJ | 学习笔记</description>
        <generator>Hugo -- gohugo.io</generator>
        <language>zh-CN</language>
        <lastBuildDate>Tue, 14 Feb 2017 12:42:09 +0800</lastBuildDate><atom:link href="https://blog.zrj.me/tags/chrome/index.xml" rel="self" type="application/rss+xml" /><item>
        <title>chrome 无法安装</title>
        <link>https://blog.zrj.me/posts/2017-02-14-1736/</link>
        <pubDate>Tue, 14 Feb 2017 12:42:09 +0800</pubDate>
        
        <guid>https://blog.zrj.me/posts/2017-02-14-1736/</guid>
        <description>&lt;p&gt;前两天为了剪辑一个视频，下载了各种乱七八糟的剪辑软件，被带上的了各种全家桶，把 chrome 的首页劫持了，拿 360 硬碰硬，结果搞得 chrome 本身崩溃了，所有插件全部失效，没办法，打算卸载了重装。但是卸载完了之后，发现死活装不上。&lt;/p&gt;
&lt;p&gt;chrome 的安装程序本身很装逼，啥界面都么有，就是一双击，完了一会就给你把 chrome 启动起来，这种装逼范儿在正常的时候很好使，但是遇上我们中国特色的社会主义就扑街了，装不上就搜，各种搜找不到什么资料，最后自己动手，丰衣足食，总算爬出来坑，这个坑本身不深，但是隐晦，而且网上没有什么记载&lt;/p&gt;
&lt;p&gt;首先，chrome 没有报错信息，这个就恶心了，拿 everything 全局搜一下，关键词拼拼凑凑猜猜看，找到这个文件，C:\Users\ZRJ\AppData\Local\Temp\chrome_installer.log&lt;/p&gt;
&lt;pre tabindex=&#34;0&#34;&gt;&lt;code&gt;[0204/100349:ERROR:install_util.cc(560)] Failed to delete registry value: (Default) error: 5
[0204/100349:ERROR:uninstall.cc(395)] Failed to delete folder: C:\Users\ZRJ\AppData\Local\Google\Chrome\Application\53.0.2767.5
[0204/100349:ERROR:install_util.cc(147)] Software\Microsoft\Active Setup\Installed Components\{8A69D345-D564-463c-AFF1-A69D9E530F96}, 6
[0213/170026.339:ERROR:setup_main.cc(643)] Already installed version 55.0.2883.87 at system-level conflicts with this one at user-level.
[0213/170032:VERBOSE1:setup_main.cc(1829)] Command Line: &amp;#34;C:\Program Files (x86)\Google\Chrome\Application\55.0.2883.87\Installer\chrmstp.exe&amp;#34; --configure-user-settings --verbose-logging --system-level --multi-install --chrome --force-configure-user-settings
[0213/170032:VERBOSE1:setup_main.cc(1831)] multi install is 1
[0213/170032:VERBOSE1:setup_main.cc(1834)] system install is 1
[0213/170032:VERBOSE1:installer_state.cc(119)] Install distribution: Google Chrome
[0213/170032:VERBOSE1:installer_state.cc(128)] Install distribution: Google Chrome binaries
[0213/170032:VERBOSE1:install_util.cc(231)] Windows NT 6.1.7601 SP1
[0213/170032:VERBOSE1:install_worker.cc(1248)] Adding unregistration items for per-user Metro keys.
[0213/170032:VERBOSE1:work_item_list.cc(34)] Beginning execution of work item list Cleanup deprecated per-user registrations
[0213/170032:VERBOSE1:install_util.cc(395)] Deleting registry key Software\Google\Chrome\Metro
[0213/170032:VERBOSE1:install_util.cc(395)] Deleting registry key Software\Google\Chrome\Metro
[0213/170032:VERBOSE1:work_item_list.cc(55)] Successful execution of work item list Cleanup deprecated per-user registrations
[0213/170032:VERBOSE1:install.cc(118)] Creating per-user Desktop &amp;#34;Google Chrome&amp;#34; shortcut to C:\Program Files (x86)\Google\Chrome\Application\chrome.exe.
[0213/170032:VERBOSE1:install.cc(118)] Creating per-user Quick Launch &amp;#34;Google Chrome&amp;#34; shortcut to C:\Program Files (x86)\Google\Chrome\Application\chrome.exe.
[0213/170033:VERBOSE1:install.cc(118)] Creating per-user Start menu &amp;#34;Google Chrome&amp;#34; shortcut to C:\Program Files (x86)\Google\Chrome\Application\chrome.exe and pinning to the taskbar.
[0213/170033:VERBOSE1:persistent_histogram_storage.cc(60)] Persistent histograms saved in file: C:\Program Files (x86)\Google\Chrome\Application\SetupMetrics\20170213170033.pma
[0213/170039.451:ERROR:setup_main.cc(643)] Already installed version 55.0.2883.87 at system-level conflicts with this one at user-level.
[0213/170604.155:ERROR:setup_main.cc(643)] Already installed version 55.0.2883.87 at system-level conflicts with this one at user-level.
[0213/170645.620:ERROR:setup_main.cc(643)] Already installed version 55.0.2883.87 at system-level conflicts with this one at user-level.
[0213/170824.831:ERROR:setup_main.cc(643)] Already installed version 55.0.2883.87 at system-level conflicts with this one at user-level.
[0213/171330.653:ERROR:setup_main.cc(643)] Already installed version 55.0.2883.87 at system-level conflicts with this one at user-level.
[0213/171505.203:ERROR:setup_main.cc(643)] Already installed version 55.0.2883.87 at system-level conflicts with this one at user-level.
[0213/171609.456:ERROR:setup_main.cc(643)] Already installed version 55.0.2883.87 at system-level conflicts with this one at user-level.
[0213/171921.440:ERROR:setup_main.cc(643)] Already installed version 55.0.2883.87 at system-level conflicts with this one at user-level.
[0213/172435.988:ERROR:setup_main.cc(506)] Already installed version 55.0.2883.87 at system-level conflicts with this one at user-level.
[0213/172634.484:ERROR:setup_main.cc(506)] Already installed version 55.0.2883.87 at system-level conflicts with this one at user-level.
[0213/175923.024:ERROR:setup_main.cc(643)] Already installed version 55.0.2883.87 at system-level conflicts with this one at user-level.
[0213/181412.694:ERROR:setup_main.cc(643)] Already installed version 55.0.2883.87 at system-level conflicts with this one at user-level.
[0213/191239.425:ERROR:setup_main.cc(643)] Already installed version 55.0.2883.87 at system-level conflicts with this one at user-level.
[0213/191317.753:ERROR:setup_main.cc(643)] Already installed version 55.0.2883.87 at system-level conflicts with this one at user-level.
[0213/191337.530:ERROR:setup_main.cc(643)] Already installed version 55.0.2883.87 at system-level conflicts with this one at user-level.
[0213/191347.850:ERROR:setup_main.cc(643)] Already installed version 55.0.2883.87 at system-level conflicts with this one at user-level.
[0213/230853.119:ERROR:setup_main.cc(643)] Already installed version 55.0.2883.87 at system-level conflicts with this one at user-level.
[0213/231436.550:ERROR:setup_main.cc(643)] Already installed version 55.0.2883.87 at system-level conflicts with this one at user-level.
[0213/231552.663:ERROR:setup_main.cc(506)] Already installed version 55.0.2883.87 at system-level conflicts with this one at user-level.
[0213/231611.440:ERROR:setup_main.cc(506)] Already installed version 55.0.2883.87 at system-level conflicts with this one at user-level.
[0213/231623.527:ERROR:setup_main.cc(643)] Already installed version 55.0.2883.87 at system-level conflicts with this one at user-level.
[0213/231627.183:ERROR:setup_main.cc(643)] Already installed version 55.0.2883.87 at system-level conflicts with this one at user-level.
[0213/231632.439:ERROR:setup_main.cc(643)] Already installed version 55.0.2883.87 at system-level conflicts with this one at user-level.
[0213/232142.892:ERROR:setup_main.cc(643)] Already installed version 55.0.2883.87 at system-level conflicts with this one at user-level.
[0213/232152.259:ERROR:setup_main.cc(643)] Already installed version 55.0.2883.87 at system-level conflicts with this one at user-level.
[0213/232155.071:ERROR:setup_main.cc(506)] Already installed version 55.0.2883.87 at system-level conflicts with this one at user-level.
[0213/232343.644:ERROR:setup_main.cc(643)] Already installed version 55.0.2883.87 at system-level conflicts with this one at user-level.
&lt;/code&gt;&lt;/pre&gt;&lt;p&gt;看到里面的一堆报错，说是已经在系统级别装了一个，所以不再安装了。&lt;/p&gt;
&lt;p&gt;那么自然想到是没有卸载干净，这种问题无非两个地方，一个文件系统，一个注册表，注册表麻烦，先试试文件系统，everything 神器再请出来，把带有 chrome 关键字的各种文件都删了，还是不行，于是注册表编辑器查找带 chrome 的各种项，一顿删，总算可以了&lt;/p&gt;
&lt;p&gt;当然，删注册表有风险，下手的时候请小心&lt;/p&gt;
&lt;hr&gt;
&lt;h2 id=&#34;历史评论&#34;&gt;历史评论
&lt;/h2&gt;&lt;p&gt;&lt;strong&gt;house&lt;/strong&gt; (2018-08-31 11:34:20):&lt;/p&gt;
&lt;blockquote&gt;
&lt;p&gt;这个bug一直有啊 我大学也碰到过一次&lt;/p&gt;
&lt;/blockquote&gt;
&lt;p&gt;&lt;strong&gt;ZRJ&lt;/strong&gt; (2018-08-31 19:24:55):&lt;/p&gt;
&lt;blockquote&gt;
&lt;p&gt;所以还是那句话，【这种装逼范儿在正常的时候很好使，但是遇上我们中国特色的社会主义就扑街了】，做人还是不能太装逼&lt;/p&gt;
&lt;/blockquote&gt;
</description>
        </item>
        <item>
        <title>Chrome 中印象笔记悦读插件的问题</title>
        <link>https://blog.zrj.me/posts/2015-02-10-chrome-%E4%B8%AD%E5%8D%B0%E8%B1%A1%E7%AC%94%E8%AE%B0%E6%82%A6%E8%AF%BB%E6%8F%92%E4%BB%B6%E7%9A%84%E9%97%AE%E9%A2%98/</link>
        <pubDate>Tue, 10 Feb 2015 21:00:34 +0800</pubDate>
        
        <guid>https://blog.zrj.me/posts/2015-02-10-chrome-%E4%B8%AD%E5%8D%B0%E8%B1%A1%E7%AC%94%E8%AE%B0%E6%82%A6%E8%AF%BB%E6%8F%92%E4%BB%B6%E7%9A%84%E9%97%AE%E9%A2%98/</guid>
        <description>&lt;p&gt;印象笔记有一个 Chrome 插件，叫做悦读，可以过滤页面上的杂乱元素，得到一个清爽的纯内容视图，并且可以剪辑到印象笔记中，是个很好的插件。&lt;/p&gt;
&lt;p&gt;然而有一个问题，例如这个页面，&lt;a class=&#34;link&#34; href=&#34;http://www.techxue.com/techxue-12450-1.html&#34;  target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;http://www.techxue.com/techxue-12450-1.html&lt;/a&gt;，摘取一段话&lt;/p&gt;
&lt;blockquote&gt;
&lt;p&gt;微信由腾讯公司于2011年1月推出，到2013年第4季度，注册用户量已经突破6亿，月活跃用户数达到3.55亿，是亚洲地区拥有最大用户群体的移动即时通讯软件。它先后实现了公众平台、朋友圈、消息推送、钱包等功能。现在的微信拥有巨大的话语权，近期它与支付宝的对决，更是霸气侧漏。那么，这么高逼格的平台是如何横空出世的呢。请往下看。&lt;/p&gt;
&lt;/blockquote&gt;
&lt;p&gt;这段话在阅读器视图中变成了&lt;/p&gt;
&lt;blockquote&gt;
&lt;p&gt;微信由腾讯公司于月推出，到季度，注册用户量已经突破亿，月活跃用户数达到亿，是亚洲地区拥有最大用户群体的移动即时通讯软件。它先后实现了公众平台、朋友圈、消息推送、钱包等功能。现在的微信拥有巨大的话语权，近期它与支付宝的对决，更是霸气侧漏。那么，这么高逼格的平台是如何横空出世的呢。请往下看。&lt;/p&gt;
&lt;/blockquote&gt;
&lt;p&gt;很明显，数字都不见了，看了一眼源代码，究其原因，是因为代码的 span 标签有 lang 属性&lt;/p&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; class=&#34;chroma&#34;&gt;&lt;code class=&#34;language-html&#34; data-lang=&#34;html&#34;&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;&lt;span class=&#34;p&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;font&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;size&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;3&amp;#34;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;	&lt;span class=&#34;p&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;style&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;&amp;#34;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;微信由腾讯公司于&lt;span class=&#34;p&#34;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;	&lt;span class=&#34;p&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;lang&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;EN-US&amp;#34;&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;style&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;&amp;#34;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;2011&lt;span class=&#34;p&#34;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;	&lt;span class=&#34;p&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;style&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;&amp;#34;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;年&lt;span class=&#34;p&#34;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;	&lt;span class=&#34;p&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;lang&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;EN-US&amp;#34;&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;style&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;&amp;#34;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;1&lt;span class=&#34;p&#34;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;	&lt;span class=&#34;p&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;style&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;&amp;#34;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;月推出，到&lt;span class=&#34;p&#34;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;	&lt;span class=&#34;p&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;lang&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;EN-US&amp;#34;&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;style&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;&amp;#34;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;2013&lt;span class=&#34;p&#34;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;	&lt;span class=&#34;p&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;style&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;&amp;#34;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;年第&lt;span class=&#34;p&#34;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;	&lt;span class=&#34;p&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;lang&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;EN-US&amp;#34;&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;style&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;&amp;#34;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;4&lt;span class=&#34;p&#34;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;	&lt;span class=&#34;p&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;style&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;&amp;#34;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;		季度，注册
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;		&lt;span class=&#34;p&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;a&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;href&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;http://techxue.com/yonghu/&amp;#34;&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;target&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;_blank&amp;#34;&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;class&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;relatedlink&amp;#34;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;用户&lt;span class=&#34;p&#34;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;a&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;量已经突破
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;	&lt;span class=&#34;p&#34;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;	&lt;span class=&#34;p&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;lang&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;EN-US&amp;#34;&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;style&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;&amp;#34;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;6&lt;span class=&#34;p&#34;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;	&lt;span class=&#34;p&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;style&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;&amp;#34;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;亿，月活跃用户数达到&lt;span class=&#34;p&#34;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;	&lt;span class=&#34;p&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;lang&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;EN-US&amp;#34;&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;style&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;&amp;#34;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;3.55&lt;span class=&#34;p&#34;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;	&lt;span class=&#34;p&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;style&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;&amp;#34;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;		亿，是亚洲地区拥有最大用户群体的移动即时通讯软件。它先后实现了公众平台、朋友圈、消息推送、钱包等功能。现在的微信拥有巨大的话语权，近期它与
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;		&lt;span class=&#34;p&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;a&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;href&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;http://www.techxue.com/dutu/zhifu/&amp;#34;&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;target&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;_blank&amp;#34;&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;class&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;relatedlink&amp;#34;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;支付&lt;span class=&#34;p&#34;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;a&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;宝的对决，更是霸气侧漏。那么，这么高逼格的平台是如何横空出世的呢。请往下看。
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;	&lt;span class=&#34;p&#34;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;&lt;span class=&#34;p&#34;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;font&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;我猜这是某个富文本编辑工具加上的，那么自然想到，如果把这些差异抹平，是不是问题就可以解决，怎么去掉呢，jQuery 自然就是一个办法，那么首先的问题就是怎么引入 jQuery，这里说了，&lt;a class=&#34;link&#34; href=&#34;http://stackoverflow.com/questions/7474354/include-jquery-in-the-javascript-console&#34;  target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;http://stackoverflow.com/questions/7474354/include-jquery-in-the-javascript-console&lt;/a&gt;&lt;/p&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; class=&#34;chroma&#34;&gt;&lt;code class=&#34;language-javascript&#34; data-lang=&#34;javascript&#34;&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;&lt;span class=&#34;kd&#34;&gt;var&lt;/span&gt; &lt;span class=&#34;nx&#34;&gt;jq&lt;/span&gt; &lt;span class=&#34;o&#34;&gt;=&lt;/span&gt; &lt;span class=&#34;nb&#34;&gt;document&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;.&lt;/span&gt;&lt;span class=&#34;nx&#34;&gt;createElement&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;(&lt;/span&gt;&lt;span class=&#34;s1&#34;&gt;&amp;#39;script&amp;#39;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;);&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;&lt;span class=&#34;nx&#34;&gt;jq&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;.&lt;/span&gt;&lt;span class=&#34;nx&#34;&gt;src&lt;/span&gt; &lt;span class=&#34;o&#34;&gt;=&lt;/span&gt; &lt;span class=&#34;s2&#34;&gt;&amp;#34;https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js&amp;#34;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;&lt;span class=&#34;nb&#34;&gt;document&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;.&lt;/span&gt;&lt;span class=&#34;nx&#34;&gt;getElementsByTagName&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;(&lt;/span&gt;&lt;span class=&#34;s1&#34;&gt;&amp;#39;head&amp;#39;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;)[&lt;/span&gt;&lt;span class=&#34;mi&#34;&gt;0&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;].&lt;/span&gt;&lt;span class=&#34;nx&#34;&gt;appendChild&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;(&lt;/span&gt;&lt;span class=&#34;nx&#34;&gt;jq&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;);&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;&lt;span class=&#34;c1&#34;&gt;// ... give time for script to load, then type.
&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;&lt;span class=&#34;nx&#34;&gt;jQuery&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;.&lt;/span&gt;&lt;span class=&#34;nx&#34;&gt;noConflict&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;();&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;然后去掉 span 的 lang 其实就是一行代码的事情&lt;/p&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; class=&#34;chroma&#34;&gt;&lt;code class=&#34;language-javascript&#34; data-lang=&#34;javascript&#34;&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;&lt;span class=&#34;nx&#34;&gt;$&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;(&lt;/span&gt;&lt;span class=&#34;s2&#34;&gt;&amp;#34;span[lang]&amp;#34;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;).&lt;/span&gt;&lt;span class=&#34;nx&#34;&gt;removeAttr&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;(&lt;/span&gt;&lt;span class=&#34;s2&#34;&gt;&amp;#34;lang&amp;#34;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;)&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;完成之后的效果就是&lt;/p&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; class=&#34;chroma&#34;&gt;&lt;code class=&#34;language-html&#34; data-lang=&#34;html&#34;&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;&lt;span class=&#34;p&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;font&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;size&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;3&amp;#34;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;	&lt;span class=&#34;p&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;style&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;&amp;#34;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;微信由腾讯公司于&lt;span class=&#34;p&#34;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;	&lt;span class=&#34;p&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;style&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;&amp;#34;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;2011&lt;span class=&#34;p&#34;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;	&lt;span class=&#34;p&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;style&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;&amp;#34;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;年&lt;span class=&#34;p&#34;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;	&lt;span class=&#34;p&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;style&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;&amp;#34;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;1&lt;span class=&#34;p&#34;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;	&lt;span class=&#34;p&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;style&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;&amp;#34;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;月推出，到&lt;span class=&#34;p&#34;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;	&lt;span class=&#34;p&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;style&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;&amp;#34;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;2013&lt;span class=&#34;p&#34;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;	&lt;span class=&#34;p&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;style&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;&amp;#34;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;年第&lt;span class=&#34;p&#34;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;	&lt;span class=&#34;p&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;style&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;&amp;#34;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;4&lt;span class=&#34;p&#34;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;	&lt;span class=&#34;p&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;style&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;&amp;#34;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;		季度，注册
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;		&lt;span class=&#34;p&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;a&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;href&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;http://techxue.com/yonghu/&amp;#34;&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;target&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;_blank&amp;#34;&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;class&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;relatedlink&amp;#34;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;用户&lt;span class=&#34;p&#34;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;a&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;量已经突破
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;	&lt;span class=&#34;p&#34;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;	&lt;span class=&#34;p&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;style&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;&amp;#34;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;6&lt;span class=&#34;p&#34;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;	&lt;span class=&#34;p&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;style&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;&amp;#34;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;亿，月活跃用户数达到&lt;span class=&#34;p&#34;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;	&lt;span class=&#34;p&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;style&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;&amp;#34;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;3.55&lt;span class=&#34;p&#34;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;	&lt;span class=&#34;p&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;style&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;&amp;#34;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;		亿，是亚洲地区拥有最大用户群体的移动即时通讯软件。它先后实现了公众平台、朋友圈、消息推送、钱包等功能。现在的微信拥有巨大的话语权，近期它与
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;		&lt;span class=&#34;p&#34;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;a&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;href&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;http://www.techxue.com/dutu/zhifu/&amp;#34;&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;target&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;_blank&amp;#34;&lt;/span&gt; &lt;span class=&#34;na&#34;&gt;class&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;=&lt;/span&gt;&lt;span class=&#34;s&#34;&gt;&amp;#34;relatedlink&amp;#34;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;支付&lt;span class=&#34;p&#34;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;a&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;宝的对决，更是霸气侧漏。那么，这么高逼格的平台是如何横空出世的呢。请往下看。
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;	&lt;span class=&#34;p&#34;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;span&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;&lt;span class=&#34;p&#34;&gt;&amp;lt;/&lt;/span&gt;&lt;span class=&#34;nt&#34;&gt;font&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;&amp;gt;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;p&gt;本来一心以为这样就搞掂了，但是一启动阅读器视图，还是那个鸟样，看来还是有什么地方没有搞好，后续继续折腾。&lt;/p&gt;
</description>
        </item>
        <item>
        <title>chrome 扩展开发二三事</title>
        <link>https://blog.zrj.me/posts/2014-06-10-chrome-%E6%89%A9%E5%B1%95%E5%BC%80%E5%8F%91%E4%BA%8C%E4%B8%89%E4%BA%8B/</link>
        <pubDate>Tue, 10 Jun 2014 21:28:34 +0800</pubDate>
        
        <guid>https://blog.zrj.me/posts/2014-06-10-chrome-%E6%89%A9%E5%B1%95%E5%BC%80%E5%8F%91%E4%BA%8C%E4%B8%89%E4%BA%8B/</guid>
        <description>&lt;ol&gt;
&lt;li&gt;chrome 扩展可以通过 chrome.webRequest.onBeforeSendHeaders 回调来修改请求头，修改请求头部字段会在 TCP 连接发起之后，也就是这个时候 URL 已经是不能变的，这个接口也可以修改 URL，会导致一次重定向，不过貌似重定向之后携带的 cookie 会有些异常，没有细跟&lt;/li&gt;
&lt;li&gt;那么，自然的，会想到一个问题，怎么获取请求的响应呢，对于这个问题，答案是，一般情况下，chrome 扩展无法获取请求的响应，参看，&lt;a class=&#34;link&#34; href=&#34;http://stackoverflow.com/questions/18534771/chrome-extension-how-to-get-http-response-body&#34;  title=&#34;http://stackoverflow.com/questions/18534771/chrome-extension-how-to-get-http-response-body&#34;
     target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;http://stackoverflow.com/questions/18534771/chrome-extension-how-to-get-http-response-body&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;那么不一般的情况呢，我们需要通过 chrome.devtools.network.onRequestFinished 来监听响应报文，但是，这个接口只能在 dev tools 中使用，所谓 dev tools，就是说，你需要自定义一个控制台面板，就是按下 F12 之后出来的那些 Elements, Network, Console 那一排，在那后面，自己追加一个，参看，&lt;a class=&#34;link&#34; href=&#34;http://stackoverflow.com/questions/10393638/chrome-extensions-other-ways-to-read-response-bodies-than-chrome-devtools-netw&#34;  title=&#34;http://stackoverflow.com/questions/10393638/chrome-extensions-other-ways-to-read-response-bodies-than-chrome-devtools-netw&#34;
     target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;http://stackoverflow.com/questions/10393638/chrome-extensions-other-ways-to-read-response-bodies-than-chrome-devtools-netw&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;写一个自己的 panel 其实不难，还是 html javascript css 那一套，通过 chrome.devtools.panels.create 来创建自己的 panel&lt;/li&gt;
&lt;li&gt;问题是一般情况下，我们把调试信息打到 console.log 里面，这个是调试一般页面的好方法，但是，如果我们本身就要调试一个 console，那么怎么办呢，&lt;a class=&#34;link&#34; href=&#34;http://codemadesimple.wordpress.com/2012/11/15/debug-chrome-dev-tools-panel/&#34;  title=&#34;http://codemadesimple.wordpress.com/2012/11/15/debug-chrome-dev-tools-panel/&#34;
     target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;http://codemadesimple.wordpress.com/2012/11/15/debug-chrome-dev-tools-panel/&lt;/a&gt;，这里提供了一个思路，把 dev page 写成 options page，然后用 options page 来调，但是，如果我们的 dev page 是跟当前页面紧密耦合的，例如，我们需要调试当前页面的响应的话，这种情况，他的方法貌似就不奏效了&lt;/li&gt;
&lt;li&gt;&lt;a class=&#34;link&#34; href=&#34;http://stackoverflow.com/questions/11103780/console-log-for-chrome-devtools-api&#34;  title=&#34;http://stackoverflow.com/questions/11103780/console-log-for-chrome-devtools-api&#34;
     target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;http://stackoverflow.com/questions/11103780/console-log-for-chrome-devtools-api&lt;/a&gt;，这里有一些其他的讨论，主要是重载 console 的，但是在我这儿试了试，貌似不是很奏效&lt;/li&gt;
&lt;li&gt;所以我最后的办法是 alert&lt;/li&gt;
&lt;li&gt;另外一个小 tips，对于 json 格式的 alert，会打 object，这个其实毛线用都没有，我也知道他是一个 object 啊，这个时候，可以 alert(JSON.stringify(xxx))，可以把 json 内容展开&lt;/li&gt;
&lt;li&gt;如果想要在插件中发起跨域的 ajax 请求，记得在 manifest.json 中声明相关的权限&lt;/li&gt;
&lt;li&gt;对于旧版本的 chrome，例如 chrome 31，即使你声明了跨域的权限，也没法在 dev page 中发起跨域的请求，background page 中可以&lt;/li&gt;
&lt;li&gt;所以就需要曲线救国，使用 chrome 扩展的模块间通讯接口，把需要发起的请求包装送到可以发起请求的地方去发送，收到回复之后再送回来，相关的接口是 chrome.runtime.sendMessage 和 chrome.runtime.onMessage.addListener&lt;/li&gt;
&lt;li&gt;chrome.runtime.onMessage.addListener 的回调函数中有一个 sendResponse 的回复用的函数，如果需要异步的使用这个函数，记得 return true，这是个坑，而且不容易发现，官方是这么说的，runtime.onMessage: The chrome.runtime.onMessage listener must return true if you want to send a response after the listener returns&lt;/li&gt;
&lt;li&gt;近日，google 开始推送 chrome 35.0.1916.114，从这个版本开始，chrome 不再允许用户自行安装插件&lt;/li&gt;
&lt;li&gt;上有政策下有对策，对策总结起来不外乎，不升级 chrome，把插件发布到 store，让用户用开发者模式运行&lt;/li&gt;
&lt;li&gt;另外还有一个大杀器，&lt;a class=&#34;link&#34; href=&#34;https://support.google.com/chrome/a/answer/188453?hl=en&#34;  title=&#34;https://support.google.com/chrome/a/answer/188453?hl=en&#34;
     target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;https://support.google.com/chrome/a/answer/188453?hl=en&lt;/a&gt;，这个大杀器我还没怎么深入研究，稍后再看看这个好不好使&lt;/li&gt;
&lt;li&gt;感言，chrome 已经不是一个浏览器，而像是一个操作系统了&lt;/li&gt;
&lt;/ol&gt;
&lt;p&gt;-&amp;mdash;&amp;mdash;&amp;mdash;&amp;mdash;&amp;mdash;&amp;mdash;&amp;ndash;&lt;/p&gt;
&lt;p&gt;2014-6-13 11:22:07 update&lt;/p&gt;
&lt;ol&gt;
&lt;li&gt;&lt;a class=&#34;link&#34; href=&#34;http://tieba.baidu.com/p/1740161948&#34;  title=&#34;http://tieba.baidu.com/p/1740161948&#34;
     target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;http://tieba.baidu.com/p/1740161948&lt;/a&gt;，这里提到了用 ad block plus 作为例子的企业定制安装方式&lt;/li&gt;
&lt;li&gt;&lt;a class=&#34;link&#34; href=&#34;http://dev.chromium.org/administrators/policy-list-3#ExtensionInstallForcelist&#34;  title=&#34;http://dev.chromium.org/administrators/policy-list-3#ExtensionInstallForcelist&#34;
     target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;http://dev.chromium.org/administrators/policy-list-3#ExtensionInstallForcelist&lt;/a&gt;，这里是 google 官方给出的一些安装说明&lt;/li&gt;
&lt;li&gt;&lt;a class=&#34;link&#34; href=&#34;https://developer.chrome.com/extensions/hosting.html&#34;  title=&#34;https://developer.chrome.com/extensions/hosting.html&#34;
     target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;https://developer.chrome.com/extensions/hosting.html&lt;/a&gt;，这里说明了安装文件的托管方式&lt;/li&gt;
&lt;li&gt;但是当我尝试使用这种方式进行安装的时候一直安装不上去，阅读了文档，提到 content type，也正确设置了，还是不行&lt;/li&gt;
&lt;li&gt;于是我尝试把 ad block plus 的安装文件部署到自己的环境上，是可以安装的，于是我开始认为是我的 crx 打包的有问题&lt;/li&gt;
&lt;li&gt;后来查到了这里，&lt;a class=&#34;link&#34; href=&#34;http://productforums.google.com/forum/#!topic/chrome/ayfF5WaeQqc&#34;  title=&#34;http://productforums.google.com/forum/#!topic/chrome/ayfF5WaeQqc&#34;
     target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;http://productforums.google.com/forum/#!topic/chrome/ayfF5WaeQqc&lt;/a&gt;，同学们在反应 web store 的扩展安装不上去，从这个帖子里面找到一个叫  chrome debug 的 log 文件&lt;/li&gt;
&lt;li&gt;&lt;a class=&#34;link&#34; href=&#34;http://www.chromium.org/for-testers/enable-logging&#34;  title=&#34;http://www.chromium.org/for-testers/enable-logging&#34;
     target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;http://www.chromium.org/for-testers/enable-logging&lt;/a&gt;，这里说明了怎么打开 log&lt;/li&gt;
&lt;li&gt;从 log 中翻查，终于找到原因，原来是扩展的 id 不同，在开发者模式下，我看到一个 id 是 a，但是，打包之后，扩展的 id 变成了 b，跟声明的不符，所以安装不上，哇靠，要是不看日志，鬼知道 id 会不匹配啊&lt;/li&gt;
&lt;li&gt;&lt;a class=&#34;link&#34; href=&#34;https://developer.chrome.com/extensions/packaging&#34;  title=&#34;https://developer.chrome.com/extensions/packaging&#34;
     target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;https://developer.chrome.com/extensions/packaging&lt;/a&gt;，这里说了一些打包时候的注意事项&lt;/li&gt;
&lt;li&gt;&lt;a class=&#34;link&#34; href=&#34;https://developer.chrome.com/extensions/autoupdate&#34;  title=&#34;https://developer.chrome.com/extensions/autoupdate&#34;
     target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;https://developer.chrome.com/extensions/autoupdate&lt;/a&gt;，这里说明了一些关于扩展自动升级的事项&lt;/li&gt;
&lt;li&gt;旧版本的 chrome，例如 31，在企业安装的时候，会比较慢，一般需要等 1-3 分钟才会发起请求去拉安装文件，新版本的就快很多，一般一启动就去拉了，不知道为什么&lt;/li&gt;
&lt;li&gt;chrome 31 的插件安装缓慢跟版本本身有关，跟网络环境无关，这个没办法&lt;/li&gt;
&lt;/ol&gt;
&lt;p&gt;-&amp;mdash;&amp;mdash;&amp;mdash;&amp;mdash;&amp;mdash;&amp;mdash;&amp;mdash;&amp;ndash;&lt;/p&gt;
&lt;p&gt;2014-6-19 10:26:28 update&lt;/p&gt;
&lt;p&gt;在线的 javascript 代码压缩和混淆工具有，&lt;a class=&#34;link&#34; href=&#34;http://closure-compiler.appspot.com/home&#34;  title=&#34;http://closure-compiler.appspot.com/home&#34;
     target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;http://closure-compiler.appspot.com/home&lt;/a&gt;，&lt;a class=&#34;link&#34; href=&#34;http://marijnhaverbeke.nl/uglifyjs&#34;  title=&#34;http://marijnhaverbeke.nl/uglifyjs&#34;
     target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;http://marijnhaverbeke.nl/uglifyjs&lt;/a&gt;，&lt;a class=&#34;link&#34; href=&#34;http://ganquan.info/yui/&#34;  title=&#34;http://ganquan.info/yui/&#34;
     target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;http://ganquan.info/yui/&lt;/a&gt;&lt;/p&gt;
&lt;hr&gt;
&lt;h2 id=&#34;历史评论&#34;&gt;历史评论
&lt;/h2&gt;&lt;p&gt;&lt;strong&gt;tonyseek&lt;/strong&gt; (2014-06-14 16:21:10):&lt;/p&gt;
&lt;blockquote&gt;
&lt;p&gt;“修改请求头部字段会在 TCP 连接发起之后，也就是这个时候 URL 已经是不能变的” 似乎这个时候 HTTP 请求还没有建立，所以虽然 TCP 连接已建立，但是修改 Host Name 和 URL 的 Path 还是可行的吧？未亲测。&lt;/p&gt;
&lt;/blockquote&gt;
&lt;p&gt;&lt;strong&gt;ZRJ&lt;/strong&gt; (2014-06-16 10:56:40):&lt;/p&gt;
&lt;blockquote&gt;
&lt;p&gt;嗯，修改 url 的那个方式我没有细跟，原因是当时修改了 url 之后重新带上的 cookie 貌似有问题，所以就用了修改请求头其他字段的方式，至于说重新发起 tcp，我猜可能是 chrome 为了防止修改之后的 url 跟修改之前的 url 不是同一个目标机器上的，所以才会弃用原来的 tcp 连接而发起重新的 tcp 连接&lt;/p&gt;
&lt;/blockquote&gt;
&lt;p&gt;&lt;strong&gt;dahaijiang&lt;/strong&gt; (2014-06-20 09:50:15):&lt;/p&gt;
&lt;blockquote&gt;
&lt;p&gt;强大呀！&lt;/p&gt;
&lt;/blockquote&gt;
</description>
        </item>
        <item>
        <title>豆瓣读书频道深大图书馆插件</title>
        <link>https://blog.zrj.me/posts/2012-08-21-%E8%B1%86%E7%93%A3%E8%AF%BB%E4%B9%A6%E9%A2%91%E9%81%93%E6%B7%B1%E5%A4%A7%E5%9B%BE%E4%B9%A6%E9%A6%86%E6%8F%92%E4%BB%B6/</link>
        <pubDate>Tue, 21 Aug 2012 12:56:18 +0800</pubDate>
        
        <guid>https://blog.zrj.me/posts/2012-08-21-%E8%B1%86%E7%93%A3%E8%AF%BB%E4%B9%A6%E9%A2%91%E9%81%93%E6%B7%B1%E5%A4%A7%E5%9B%BE%E4%B9%A6%E9%A6%86%E6%8F%92%E4%BB%B6/</guid>
        <description>&lt;p&gt;创意是崔琦提出来的，前天晚上完成了 demo，昨天一天不在宿舍，于是昨晚回来继续改，早上继续改了一些细节，基本上就这个样子了&lt;/p&gt;
&lt;p&gt;&lt;a class=&#34;link&#34; href=&#34;http://zrj.me/wp-content/uploads/2012/08/Unnamed-QQ-Screenshot20120821125029.png&#34;  target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;&lt;img src=&#34;https://blog.zrj.me/images/Unnamed-QQ-Screenshot20120821125029.png&#34;
	
	
	
	loading=&#34;lazy&#34;
	
	
&gt;&lt;/a&gt;&lt;/p&gt;
&lt;p&gt;请看图上的亮点在于，1994 年应还。。&lt;/p&gt;
&lt;p&gt;附上安装程序&lt;/p&gt;
&lt;p&gt;&lt;a class=&#34;link&#34; href=&#34;http://zrj.me/wp-content/uploads/2012/08/douban-helper-szulib.zip&#34;  target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;douban helper - szulib&lt;/a&gt;&lt;/p&gt;
&lt;p&gt;直接双击安装就可以了&lt;/p&gt;
&lt;p&gt;源代码在 github，&lt;a class=&#34;link&#34; href=&#34;https://github.com/ZRJ/douban-helper-szulib&#34;  target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;https://github.com/ZRJ/douban-helper-szulib&lt;/a&gt;&lt;/p&gt;
&lt;hr&gt;
&lt;h2 id=&#34;历史评论&#34;&gt;历史评论
&lt;/h2&gt;&lt;p&gt;&lt;strong&gt;邱凯达&lt;/strong&gt; (2013-01-29 23:20:11):&lt;/p&gt;
&lt;blockquote&gt;
&lt;p&gt;thx!!!&lt;/p&gt;
&lt;/blockquote&gt;
&lt;p&gt;&lt;strong&gt;ZRJ&lt;/strong&gt; (2013-01-30 08:28:29):&lt;/p&gt;
&lt;blockquote&gt;
&lt;p&gt;呃，很久没有维护更新了，不知道现在还能不能用的&lt;/p&gt;
&lt;/blockquote&gt;
</description>
        </item>
        <item>
        <title>iframe 中元素的居中问题</title>
        <link>https://blog.zrj.me/posts/2012-08-10-iframe-%E4%B8%AD%E5%85%83%E7%B4%A0%E7%9A%84%E5%B1%85%E4%B8%AD%E9%97%AE%E9%A2%98/</link>
        <pubDate>Fri, 10 Aug 2012 00:07:19 +0800</pubDate>
        
        <guid>https://blog.zrj.me/posts/2012-08-10-iframe-%E4%B8%AD%E5%85%83%E7%B4%A0%E7%9A%84%E5%B1%85%E4%B8%AD%E9%97%AE%E9%A2%98/</guid>
        <description>&lt;p&gt;今晚在折腾 iframe 中元素的居中问题，问题是这样的：在腾讯开放平台上的应用，嵌入平台是使用 iframe 的方式，当一个应用的高度比较长的时候，需要滚动屏幕，那么有两种选择，一种是父级窗口不产生滚动条，在子框架上产生滚动条，另外一种，就是及时的加长 iframe 框架的高度，让框架能够容纳里面的全部内容，从而子框架上可以不出现滚动条，那么就是父级窗口出现滚动条。&lt;/p&gt;
&lt;p&gt;问题出在使用的一个叫 fancybox 的 jquery 插件上，这个插件的作用是生成一个浮层，可以用来显示一些图片组啊，或者地图，或者外部视频等等之类的内容，应该说，这个插件还是不错的，只可惜我们应用的场景比较奇葩。他生成的浮层窗口，是相对于当前页面的可视窗口部分居中的，这个特性在一般的情况下没有问题，但是，如果页面是被嵌在一个 iframe 中的话，那么，就会造成他计算出错，从而，浮层窗口是生成在框架页面的中间，如果框架页面很长的话，就会造成浮层窗口父级窗口的可视窗口以下，需要滚动父级窗口才能看到。&lt;/p&gt;
&lt;p&gt;我本身前端也就是水一水的水平，遇到问题大概想了想，没有什么非常有把握的思路，于是就 google ，看到这里有讨论，&lt;a class=&#34;link&#34; href=&#34;https://groups.google.com/forum/?fromgroups#!topic/fancybox/KPq4mAQn2qc%5B1-25%5D&#34;  target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;https://groups.google.com/forum/?fromgroups#!topic/fancybox/KPq4mAQn2qc%5B1-25%5D&lt;/a&gt;，这位仁兄给了一个方法&lt;/p&gt;
&lt;blockquote&gt;
&lt;p&gt;I have the same problem: a page includes an iframe that is pretty long and scrollable and inside that iframe I open a fancybox (which also includes yet another iframe, but this is irrelevant here). Fancybox calculates the center of the iframe inside which it has to display itself and positions quite low on the screen because the iframe is long. I&amp;rsquo;d like it to be positioned in the center of the browser viewport instead. What I found to (somewhat) work is to use this callback when defining the attributes of fancybox (using version 1.3.1):&lt;/p&gt;
&lt;/blockquote&gt;
&lt;div class=&#34;highlight&#34;&gt;&lt;pre tabindex=&#34;0&#34; class=&#34;chroma&#34;&gt;&lt;code class=&#34;language-javascript&#34; data-lang=&#34;javascript&#34;&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;&lt;span class=&#34;s1&#34;&gt;&amp;#39;onComplete&amp;#39;&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;:&lt;/span&gt; &lt;span class=&#34;kd&#34;&gt;function&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;()&lt;/span&gt; &lt;span class=&#34;p&#34;&gt;{&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;                            &lt;span class=&#34;nx&#34;&gt;$&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;(&lt;/span&gt;&lt;span class=&#34;s2&#34;&gt;&amp;#34;#fancybox-wrap&amp;#34;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;).&lt;/span&gt;&lt;span class=&#34;nx&#34;&gt;css&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;({&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;                            &lt;span class=&#34;s1&#34;&gt;&amp;#39;top&amp;#39;&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;:&lt;/span&gt;&lt;span class=&#34;s1&#34;&gt;&amp;#39;10px&amp;#39;&lt;/span&gt;&lt;span class=&#34;p&#34;&gt;,&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;                            &lt;span class=&#34;s1&#34;&gt;&amp;#39;left&amp;#39;&lt;/span&gt;&lt;span class=&#34;o&#34;&gt;:&lt;/span&gt;&lt;span class=&#34;s1&#34;&gt;&amp;#39;10px&amp;#39;&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;span class=&#34;line&#34;&gt;&lt;span class=&#34;cl&#34;&gt;                    &lt;span class=&#34;p&#34;&gt;})}&lt;/span&gt;
&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;blockquote&gt;
&lt;p&gt;It works - moves the fancybox where I want it inside the iframe, but one problem is that it first shows it in the original position and then repositions it which is mildly annoying. I haven&amp;rsquo;t found a good way to show it in the position I want it when it first gets drawn. Replacing &amp;lsquo;onComplete&amp;rsquo; with &amp;lsquo;onStart&amp;rsquo; doesn&amp;rsquo;t do anything. I guess one way would be to have somehow make it invisible on onStart and then make it visible on onComplete when it has been repositioned. Any suggestions would be appreciated!&lt;/p&gt;
&lt;/blockquote&gt;
&lt;p&gt;思路倒也算是清晰易懂，可惜随后就被楼下的另一位仁兄踢馆了，囧&lt;/p&gt;
&lt;blockquote&gt;
&lt;p&gt;Not that obvious. &lt;a class=&#34;link&#34; href=&#34;http://fancybox.net/faq&#34;  target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;http://fancybox.net/faq&lt;/a&gt; No. 3 also says : &amp;ldquo;&amp;hellip;&amp;hellip;. You can modify FancyBox source to suit your needs&amp;rdquo; And a fellow fancybox fan did try modifying it to his needs &amp;hellip; see below copy of the email (that I haven&amp;rsquo;t tried it yet but it makes sense to me)&lt;/p&gt;
&lt;p&gt;&amp;gt;forget about the iframe: Basically it &amp;gt;would be great if we had another &amp;gt;two public attributes &amp;hellip;etc let&amp;rsquo;s the developer answer what he thinks of your suggestions&lt;/p&gt;
&lt;p&gt;***copy of email ************** hi JFK it work, ive tried it using just a simple tweak, using the on load example $(&amp;ldquo;a.sample&amp;rdquo;).trigger(&amp;ldquo;click&amp;rdquo;);&lt;/p&gt;
&lt;p&gt;here what ive done;&lt;/p&gt;
&lt;p&gt;in my iframe page i called the parent window with the href e.g. onClick=&amp;ldquo;callMe(&amp;lsquo;&lt;a class=&#34;link&#34; href=&#34;https://www.google.com&#34;  target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;www.google.com&lt;/a&gt;&amp;rsquo;)&amp;rdquo; or if pics &amp;ldquo;/images/pics.png&amp;rdquo;&lt;/p&gt;
&lt;p&gt;and call this script in my parent page&lt;/p&gt;
&lt;script type=&#34;text/javascript&#34;&gt;// &lt;![CDATA[ function callMe(site){ $(&#34;.sample&#34;).fancybox({ &#39;width&#39; : &#39;97%&#39;, &#39;height&#39; : &#39;97%&#39;, &#39;href&#39; : &#39;&#39;+site+&#39;&#39; //force href to change its site from the call function in the iframe page }); readyFancy() call to trigger the decoy link page } function readyFancy(){ $(&#34;a.sample&#34;).trigger(&#34;click&#34;); } &lt;div&gt;&lt;/div&gt; // ]]&gt;&lt;/script&gt;
&lt;p&gt;in my parent html we right a decoy link (this one is from the example on load fancybox) ******&lt;/p&gt;
&lt;/blockquote&gt;
&lt;p&gt;这里牵扯到要修改父级窗口，这个在我们这个案例里自然是行不通的，而且我也没怎么看懂他的思路，不过我确实试了试前面的方法，是真的不行的，浮层窗口在单步调试可以被设置到上面来，但是一往下运行就又被自动居中了。&lt;/p&gt;
&lt;p&gt;于是没办法，仔细的看了看插件的官网，&lt;a class=&#34;link&#34; href=&#34;http://fancybox.net/api&#34;  target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;http://fancybox.net/api&lt;/a&gt; ，api 文档，连后面的 tops 和 tricks 都看完了，还是没有解决问题，在官方的 FAQ 里面说道，&lt;/p&gt;
&lt;blockquote&gt;
&lt;p&gt;3. Can the script be called from an iframe?&lt;/p&gt;
&lt;p&gt;This is not supported as FancyBox is attached to page body. You can modify FancyBox source to suit your needs&lt;/p&gt;
&lt;/blockquote&gt;
&lt;p&gt;于是打算换一个思路，既然父级滚动条变化的时候，我们需要重新定位浮层窗口，那么直接取父级滚动条的属性就行了吧，甚至可以给父级窗口的滚动条上一个 OnScroll 事件，在这里看到类似的思路，&lt;a class=&#34;link&#34; href=&#34;http://hi.baidu.com/bing2liuliu/item/5de3b80a914e41ee359902af&#34;  target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;http://hi.baidu.com/bing2liuliu/item/5de3b80a914e41ee359902af&lt;/a&gt; ，可惜，试了一下，好像是不行的，于是上线问了问金泉，金泉给了官方的 js 的 sdk 的文档，&lt;a class=&#34;link&#34; href=&#34;http://wiki.open.qq.com/wiki/API%E5%88%97%E8%A1%A8&#34;  target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;http://wiki.open.qq.com/wiki/API%E5%88%97%E8%A1%A8&lt;/a&gt; ，在其中有一个 api 是 &lt;a class=&#34;link&#34; href=&#34;http://wiki.open.qq.com/wiki/fusion2.canvas.getClientRect&#34;  target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;http://wiki.open.qq.com/wiki/fusion2.canvas.getClientRect&lt;/a&gt; ，应该就是他了，不过，悲剧的在服务器上写代码，vim 用起啦真是各种痛苦啊，改着改着，代码就在 chrome 下乱了，明明页面上是有东西的，在 script 标签下居然变空白了，&lt;/p&gt;
&lt;p&gt;&lt;a class=&#34;link&#34; href=&#34;http://zrj.me/wp-content/uploads/2012/08/Unnamed-QQ-Screenshot20120809235840.png&#34;  target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;&lt;img src=&#34;https://blog.zrj.me/images/Unnamed-QQ-Screenshot20120809235840.png&#34;
	
	
	
	loading=&#34;lazy&#34;
	
	
&gt;&lt;/a&gt;&lt;/p&gt;
&lt;p&gt;而且单步跟也诡异&lt;/p&gt;
&lt;p&gt;首先是在这里&lt;/p&gt;
&lt;p&gt;&lt;a class=&#34;link&#34; href=&#34;http://zrj.me/wp-content/uploads/2012/08/Unnamed-QQ-Screenshot20120810000003.png&#34;  target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;&lt;img src=&#34;https://blog.zrj.me/images/Unnamed-QQ-Screenshot20120810000003.png&#34;
	
	
	
	loading=&#34;lazy&#34;
	
	
&gt;&lt;/a&gt;&lt;/p&gt;
&lt;p&gt;按理说，单步下去，应该到下一个断点啊，但是，。。。。&lt;/p&gt;
&lt;p&gt;&lt;a class=&#34;link&#34; href=&#34;http://zrj.me/wp-content/uploads/2012/08/Unnamed-QQ-Screenshot20120810000013.png&#34;  target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;&lt;img src=&#34;https://blog.zrj.me/images/Unnamed-QQ-Screenshot20120810000013.png&#34;
	
	
	
	loading=&#34;lazy&#34;
	
	
&gt;&lt;/a&gt;&lt;/p&gt;
&lt;p&gt;神奇的地球还没完，继续单步，&lt;/p&gt;
&lt;p&gt;&lt;a class=&#34;link&#34; href=&#34;http://zrj.me/wp-content/uploads/2012/08/Unnamed-QQ-Screenshot20120810000022.png&#34;  target=&#34;_blank&#34; rel=&#34;noopener&#34;
    &gt;&lt;img src=&#34;https://blog.zrj.me/images/Unnamed-QQ-Screenshot20120810000022.png&#34;
	
	
	
	loading=&#34;lazy&#34;
	
	
&gt;&lt;/a&gt;&lt;/p&gt;
&lt;p&gt;让人不得不感叹，绳命，是入刺的井猜&lt;/p&gt;
&lt;hr&gt;
&lt;h2 id=&#34;历史评论&#34;&gt;历史评论
&lt;/h2&gt;&lt;p&gt;&lt;strong&gt;ldpcm3&lt;/strong&gt; (2013-04-18 18:45:23):&lt;/p&gt;
&lt;blockquote&gt;
&lt;p&gt;你好，请问这个问题，你后来解决了吗？&lt;/p&gt;
&lt;/blockquote&gt;
&lt;p&gt;&lt;strong&gt;ZRJ&lt;/strong&gt; (2013-04-19 09:22:53):&lt;/p&gt;
&lt;blockquote&gt;
&lt;p&gt;呃，不好意思，这个过去太久了。印象中后来是绕开了这个问题，找了另外一种实现，不过我现在基本不怎么写前端 JS 了，所以也不清楚这个问题现在有没有解法，不好意思哈&lt;/p&gt;
&lt;/blockquote&gt;
</description>
        </item>
        
    </channel>
</rss>
