{"id":198778,"date":"2013-10-26T14:20:03","date_gmt":"2013-10-26T10:20:03","guid":{"rendered":"http:\/\/savepearlharbor.com\/?p=198778"},"modified":"-0001-11-30T00:00:00","modified_gmt":"-0001-11-29T21:00:00","slug":"","status":"publish","type":"post","link":"https:\/\/savepearlharbor.com\/?p=198778","title":{"rendered":"<span class=\"post_title\">\u0418\u0441\u0442\u043e\u0440\u0438\u044f \u043e\u0434\u043d\u043e\u0433\u043e Google Chrome \u0440\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0438\u044f<\/span>"},"content":{"rendered":"<div class=\"content html_format\">   \t\u0412 \u043e\u0434\u0438\u043d \u043f\u0440\u0435\u043a\u0440\u0430\u0441\u043d\u044b\u0439 \u0434\u0435\u043d\u044c, \u0437\u0430 \u043f\u0430\u0440\u0443 \u0447\u0430\u0441\u043e\u0432 \u0434\u043e \u043a\u043e\u043d\u0446\u0430 \u0440\u0430\u0431\u043e\u0442\u044b, \u043c\u043d\u0435 \u043f\u0440\u0438\u0445\u043e\u0434\u0438\u0442 \u0437\u0430\u0434\u0430\u0447\u0430: \u00ab\u041d\u0443\u0436\u043d\u043e \u043d\u0430\u043f\u0438\u0441\u0430\u0442\u044c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0434\u043b\u044f \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0434\u043e\u043b\u0436\u043d\u043e \u043f\u043e \u043a\u043b\u0438\u043a\u0443 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f \u043e\u0442\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0435 \u0441\u043e \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u043d\u0430 \u0441\u0430\u0439\u0442 \u043a\u043b\u0438\u0435\u043d\u0442\u0430. \u0427\u0442\u043e \u0437\u0430 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0438 \u043a\u0430\u043a\u043e\u0439 \u0431\u0440\u0430\u0443\u0437\u0435\u0440 \u2014 \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e \u043d\u0430 \u0432\u0430\u0448 \u0432\u044b\u0431\u043e\u0440&#8230;\u00bb.<\/p>\n<p>  \u041d\u0435\u043c\u043d\u043e\u0433\u043e \u043f\u043e\u0440\u0430\u0437\u043c\u044b\u0441\u043b\u0438\u0432 \u044f \u043f\u0440\u0438\u0448\u0435\u043b \u043a \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u0443 <b>google chrome extension<\/b>:<\/p>\n<ul>\n<li>Crome \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442 <b>Chromium<\/b> \u0434\u0432\u0438\u0436\u043e\u043a, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0444\u043e\u0440\u043a\u043e\u043c <b>WebKit<\/b> (\u0430 \u044d\u0442\u043e Safari), \u0442\u0430\u043a \u0436\u0435 \u043d\u0435 \u0437\u0430\u0431\u044b\u0432\u0430\u0435\u043c <b>Blink<\/b> (\u0430 \u044d\u0442\u043e \u0443\u0436\u0435 \u043d\u043e\u0432\u0430\u044f (\u0445\u043e\u0442\u044f \u044f \u0432\u0441\u0435 \u0435\u0449\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e \u0441\u0442\u0430\u0440\u0443\u044e \u0441 bookmarks&#8217;\u0430\u043c\u0438) Opera). \u0422\u0430\u043a\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c, \u043d\u0430\u043f\u0438\u0441\u0430\u0432 \u0440\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0438\u044f \u0434\u043b\u044f chrome, \u043c\u044b \u0441 \u043c\u0438\u043d\u0438\u043c\u0430\u043b\u044c\u043d\u044b\u043c\u0438 \u043f\u0435\u0440\u0435\u0434\u0435\u043b\u043a\u0430\u043c\u0438 (\u0430 \u0442\u043e \u0438 \u0431\u0435\u0437 \u043d\u0438\u0445) \u0441\u043c\u043e\u0436\u0435\u043c \u0435\u0433\u043e \u043f\u043e\u0440\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043d\u0430 \u0435\u0449\u0435 2 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430 <\/li>\n<li>\u041d\u0435\u0442 \u043e\u043f\u044b\u0442\u0430 \u0440\u0430\u0431\u043e\u0442\u044b \u0441 API Google Chrome<\/li>\n<li><b>Google<\/b> \u0432\u0441\u0435-\u0442\u0430\u043a\u0438 \u043a\u043e\u043c\u043f\u0430\u043d\u0438\u044f <b>\u0434\u043e\u0431\u0440\u0430<\/b> \ud83d\ude42<\/li>\n<\/ul>\n<p>  \u041a\u043e\u0433\u0434\u0430 \u043c\u044b\u0441\u043b\u0438 \u043d\u0435\u043c\u043d\u043e\u0433\u043e \u0443\u043b\u0435\u0433\u043b\u0438\u0441\u044c, \u043f\u0435\u0440\u0432\u043e\u0435 \u0447\u0442\u043e \u044f \u0441\u0434\u0435\u043b\u0430\u043b \u2014 \u044d\u0442\u043e \u0432\u0432\u0435\u043b \u0432 \u043f\u043e\u0438\u0441\u043a\u0435 \u0445\u0430\u0440\u0431\u0430 &quot;<i>\u0440\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0438\u0435 Google Chrome<\/i>&quot;. \u0423\u0432\u0438\u0434\u0435\u0432 \u043e\u0431\u0448\u0438\u0440\u043d\u044b\u0439 \u0432\u0430\u0440\u0438\u0430\u043d\u0442 \u0441\u0442\u0430\u0442\u0435\u0439 \u043f\u043e \u0434\u0430\u043d\u043d\u043e\u0439 \u0442\u0435\u043c\u0435, \u044f \u0441\u043e \u0441\u043f\u043e\u043a\u043e\u0439\u043d\u043e\u0439 \u0434\u0443\u0448\u043e\u0439 \u0443\u0448\u0435\u043b \u0434\u043e\u043c\u043e\u0439 \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e \u0443\u0432\u0435\u0440\u0435\u043d\u043d\u044b\u0439 \u0432 \u0442\u043e\u043c, \u0447\u0442\u043e \u0437\u0430\u0432\u0442\u0440\u0430 \u0441 \u0443\u0442\u0440\u0430 \u043f\u0440\u043e\u0447\u0438\u0442\u0430\u0432 \u0438\u0445, \u043a \u043a\u043e\u043d\u0446\u0443 \u0440\u0430\u0431\u043e\u0447\u0435\u0433\u043e \u0434\u043d\u044f \u0434\u0435\u043b\u043e \u0431\u0443\u0434\u0435\u0442 &#8216;<b>\u0432 \u0448\u043b\u044f\u043f\u0435<\/b>&#8216; (\u043a\u0430\u043a \u0436\u0435 \u044f \u0442\u043e\u0433\u0434\u0430 \u043e\u0448\u0438\u0431\u0430\u043b\u0441\u044f). \u041f\u0440\u043e\u0447\u0438\u0442\u0430\u0432 \u043f\u0430\u0440\u043e\u0447\u043a\u0443 \u0438\u0445 \u043d\u0438\u0445 \u044f \u0438\u043c\u0435\u043b \u043e\u0431\u0449\u0435\u0435 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u043e \u0442\u043e\u043c \u043a\u0430\u043a \u044d\u0442\u043e \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442, \u043d\u043e \u044d\u0442\u043e\u0433\u043e \u043e\u043a\u0430\u0437\u0430\u043b\u043e\u0441\u044c \u043c\u0430\u043b\u043e \u0434\u043b\u044f \u0432\u043e\u043f\u043b\u0430\u0449\u0435\u043d\u0438\u044f \u043c\u043e\u0438\u0445 \u0438\u0434\u0435\u0439. \u0427\u0442\u043e \u0436, \u043f\u0440\u0438\u0441\u0442\u0443\u043f\u0438\u043c\u2026<br \/>  <a name=\"habracut\"><\/a><br \/>  \u041e\u0442\u043a\u0440\u044b\u0432\u0430\u0435\u043c google chrome, \u0432\u0432\u043e\u0434\u0438\u043c <i>chrome:\/\/extensions<\/i>, \u0441\u0442\u0430\u0432\u0438\u043c \u0433\u0430\u043b\u043e\u0447\u043a\u0443 Developer mode, \u043d\u0430\u0436\u0438\u043c\u0430\u0435\u043c \u043a\u043d\u043e\u043f\u043a\u0443 Load unpacked extension, \u0432\u044b\u0431\u0440\u0430\u0432 \u043f\u0430\u043f\u043a\u0443 \u043d\u0430\u0436\u0438\u043c\u0430\u0435\u043c Ok.<\/p>\n<p>  <img decoding=\"async\" src=\"http:\/\/habr.habrastorage.org\/post_images\/7eb\/a85\/4ad\/7eba854ad31f65f16dde9ddff4c83401.png\"\/><\/p>\n<p>  \u0412 \u043d\u0430\u0447\u0430\u043b\u0435 \u0431\u044b\u043b\u043e <s>\u0441\u043b\u043e\u0432\u043e<\/s> \u043c\u0430\u043d\u0438\u0444\u0435\u0441\u0442. \u041d\u0438\u0436\u0435 \u043c\u043e\u0436\u0435\u0442\u0435 \u0443\u0432\u0438\u0434\u0435\u0442\u044c \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0435 \u044d\u0442\u043e\u0433\u043e \u0444\u0430\u0439\u043b\u0430 (manifest.json \u2014 \u044d\u0442\u043e \u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u043e\u0435 \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u0435 \u0444\u0430\u0439\u043b\u0430 \u043c\u0430\u043d\u0438\u0444\u0435\u0441\u0442\u0430)<\/p>\n<div class=\"spoiler\"><b class=\"spoiler_title\">manifest.json<\/b><\/p>\n<div class=\"spoiler_text\">\n<pre><code class=\"javascript\">{     &quot;manifest_version&quot;: 2,     &quot;name&quot;: &quot;My application&quot;,   \/\/ \u0442\u0443\u0442 \u043d\u0430\u0434\u0435\u044e\u0441\u044c \u0432\u0441\u0435 \u043f\u043e\u043d\u044f\u0442\u043d\u043e     &quot;version&quot;: &quot;0.9&quot;,      &quot;icons&quot;: {         &quot;16&quot;: &quot;.\/16x16.png&quot;,         &quot;32&quot;: &quot;.\/32x32.png&quot;,         &quot;48&quot;: &quot;.\/48x48.png&quot;,         &quot;128&quot;: &quot;.\/128x128.png&quot;     },      &quot;permissions&quot;: [         &quot;tabs&quot;,         &quot;http:\/\/*\/*&quot;,         &quot;https:\/\/*\/*&quot;     ],      &quot;background&quot; : {         &quot;page&quot;: &quot;background.html&quot;     },      &quot;content_scripts&quot;:[{         &quot;matches&quot;: [             &quot;http:\/\/*\/*&quot;,             &quot;https:\/\/*\/*&quot;         ],         &quot;js&quot;: [             &quot;script_in_content.js&quot;         ]     }],      &quot;browser_action&quot;: {         &quot;default_title&quot;: &quot;Application&quot;,         &quot;default_icon&quot; : &quot;.\/16x16.png&quot;         \/\/  &quot;default_popup&quot;: &quot;login.html&quot;        \/\/ \u044d\u0442\u043e \u0438\u043c\u044f html-\u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u0440\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0438\u044f, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0431\u0443\u0434\u0435\u0442 \u0432\u0441\u043f\u043b\u044b\u0432\u0430\u0442\u044c \u043f\u0440\u0438 \u043d\u0430\u0436\u0430\u0442\u0438\u0438 \u043d\u0430 \u0438\u043a\u043e\u043d\u043a\u0443, \u043c\u043e\u0436\u043d\u043e \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e JS \u0443\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0442\u044c \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0435 html \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b     } } <\/code><\/pre>\n<p>  <\/div>\n<\/div>\n<p>  <b>manifest_version<\/b> \u2014 \u043d\u0430 \u0434\u0430\u043d\u043d\u044b\u0439 \u043c\u043e\u043c\u0435\u043d\u0442 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 2 \u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u043e\u0435.<br \/>  <b>version<\/b> \u2014 \u0432\u0435\u0440\u0441\u0438\u044f \u0432\u0430\u0448\u0435\u0433\u043e \u0440\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0438\u044f, \u043c\u043e\u0436\u0435\u0442 \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u0442\u044c \u0442\u043e\u043b\u044c\u043a\u043e \u0446\u0438\u0444\u0440\u044b \u0438 `.` (\u0442\u0435. &#8216;2.1.12&#8217;, &#8216;0.59&#8217; \u0438 \u0442\u0434)<br \/>  <b>icons<\/b> \u2014 \u044d\u0442\u043e \u0441\u043f\u0438\u0441\u043e\u043a \u0432\u0441\u0435\u0445 \u0438\u043a\u043e\u043d\u043e\u043a \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0431\u0443\u0434\u0443\u0442 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0442\u0441\u044f \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435 \u0432 \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0445 \u043c\u0435\u0441\u0442\u0430\u0445 (16 \u2014 \u0432 \u0430\u0434\u0440\u0435\u0441\u043d\u043e\u0439 \u0441\u0442\u0440\u043e\u043a\u0435, 48 \u2014 \u0432 \u0441\u043f\u0438\u0441\u043a\u0435 \u0432\u0441\u0435\u0445 \u0440\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0438\u0439 \u0438 \u0442\u0434.)<br \/>  <b>permissions<\/b> \u2014 \u0437\u0434\u0435\u0441\u044c \u043f\u0435\u0440\u0435\u0447\u0438\u0441\u043b\u0435\u043d \u043c\u0430\u0441\u0441\u0438\u0432 \u0441 \u0440\u0430\u0437\u0440\u0435\u0448\u0435\u043d\u0438\u044f\u043c\u0438, \u043c\u043d\u0435 \u043d\u0443\u0436\u043d\u043e \u0431\u044b\u043b\u043e \u0442\u043e\u043b\u044c\u043a\u043e tabs.http \u0438 https \u043d\u0443\u0436\u0435\u043d \u0434\u043b\u044f ajax \u043e\u0431\u043c\u0435\u043d\u0430 \u0441 \u043b\u044e\u0431\u044b\u043c\u0438 \u0441\u0430\u0439\u0442\u0430\u043c\u0438, \u0430 \u0442\u0430\u043a\u0436\u0435 \u0434\u043b\u044f \u0442\u043e\u0433\u043e \u0447\u0442\u043e-\u0431\u044b script_in_content.js \u043c\u043e\u0433 \u043e\u0431\u043c\u0435\u043d\u0438\u0432\u0430\u0442\u0441\u044f \u0434\u0430\u043d\u043d\u044b\u043c\u0438 \u0441 \u0444\u043e\u043d\u043e\u0432\u043e\u0439 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435\u0439 \u2014 background.html.<br \/>  <b>background<\/b> \u2014 \u044d\u0442\u043e \u0438\u043c\u044f \u0444\u043e\u043d\u043e\u0432\u043e\u0439 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b. \u0424\u043e\u043d\u043e\u0432\u0430\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u2014 \u0432\u0430\u0436\u043d\u044b\u0439 \u044d\u043b\u0435\u043c\u0435\u043d\u0442, \u0445\u043e\u0442\u044f \u0434\u043b\u044f \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0439 \u043e\u043d \u0438 \u043d\u0435 \u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u0435\u043d. \u0417\u0430\u0447\u0435\u043c \u043e\u043d\u0430 \u043d\u0443\u0436\u043d\u0430 \u043d\u0435\u043c\u043d\u043e\u0433\u043e \u043f\u043e-\u043f\u043e\u0437\u0436\u0435.<br \/>  <b>content_scripts<\/b> \u2014 \u0437\u0434\u0435\u0441\u044c \u0433\u043e\u0432\u043e\u0440\u0438\u0442\u0441\u044f \u0447\u0442\u043e \u0444\u0430\u0439\u043b script_in_content.js, \u0431\u0443\u0434\u0435\u0442 \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0437\u0430\u0433\u0440\u0443\u0436\u0430\u0442\u0441\u044f \u0434\u043b\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u043e\u0442\u043a\u0440\u044b\u0442\u043e\u0439 \u0432\u043e \u0432\u043a\u043b\u0430\u0434\u043a\u0435. \u0421\u0442\u0440\u0430\u043d\u0438\u0446\u0430 \u0434\u043e\u043b\u0436\u043d\u044b \u0431\u044b\u0442\u044c \u043e\u0442\u043a\u0440\u044b\u0442\u0430 \u0441 \u0441\u0430\u0439\u0442\u043e\u0432 <b>http:\/\/*\/*<\/b> \u0442\u0435, \u0432\u0441\u0435\u0445 \u0441\u0430\u0439\u0442\u043e\u0432 \u0441 http, \u043d\u043e \u043d\u0435 https, \u0445\u043e\u0442\u044f \u043c\u043e\u0436\u043d\u043e \u0431\u044b\u043b\u043e \u0431\u044b \u0443\u043a\u0430\u0437\u0430\u0442\u044c \u0438 \u0438\u0445.<br \/>  <b>browser_action<\/b> \u2014 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 2 \u0432\u0430\u0440\u0430\u043d\u0442\u0430 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u0438\u043a\u043e\u043d\u043a\u0438 \u0440\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0438\u044f: <i>browser_action<\/i> \u0438 <i>page_action<\/i><\/p>\n<p>  <i>page_action<\/i> \u0433\u043e\u0432\u043e\u0440\u0438\u0442 \u043e \u0442\u043e\u043c \u0447\u0442\u043e \u0440\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0438\u0435 \u0438\u043d\u0434\u0438\u0432\u0438\u0434\u0443\u0430\u043b\u044c\u043d\u043e \u0434\u043b\u044f \u043a\u0430\u0436\u0434\u043e\u0439 \u0432\u043a\u043b\u0430\u0434\u043a\u0438, \u0442\u043e \u0435\u0441\u0442\u044c \u0437\u043d\u0430\u0447\u043e\u043a \u0431\u0443\u0434\u0435\u0442 \u0432\u044b\u0432\u043e\u0434\u0438\u0442\u044c\u0441\u044f \u0432 \u0430\u0434\u0440\u0435\u0441\u043d\u043e\u0439 \u0441\u0442\u0440\u043e\u043a\u0435. \u042d\u0442\u043e\u0442 \u0437\u043d\u0430\u0447\u0435\u043a \u043c\u043e\u0436\u043d\u043e \u0441\u043f\u0440\u044f\u0442\u0430\u0442\u044c\/\u043e\u0442\u043e\u0431\u0440\u0430\u0437\u0438\u0442\u044c \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e JS \u0432 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0442 \u043e\u0431\u0441\u0442\u043e\u044f\u0442\u0435\u043b\u044c\u0441\u0442\u0432.<\/p>\n<p>  <i>browser_action<\/i> \u043d\u0430\u043e\u0431\u043e\u0440\u043e\u0442 \u043d\u0435 \u0441\u0447\u0438\u0442\u0430\u044e\u0442\u0441\u044f \u0438\u043d\u0434\u0438\u0432\u0438\u0434\u0443\u0430\u043b\u044c\u043d\u044b\u043c\u0438 \u0438 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u044e\u0442\u0441\u044f \u043d\u0435 \u0432 \u0430\u0434\u0440\u0435\u0441\u043d\u043e\u0439 \u0441\u0442\u0440\u043e\u043a\u0435, \u0430 \u0432 \u043f\u0430\u043d\u0435\u043b\u0435 \u0434\u043b\u044f \u0440\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0438\u0439. \u0414\u0430\u043d\u0443\u044e \u0438\u043a\u043e\u043d\u043a\u0443 \u043d\u0438\u043a\u0430\u043a \u043d\u0435\u043b\u044c\u0437\u044f \u0441\u043a\u0440\u044b\u0442\u044c \u043d\u0430 JS (\u043d\u043e \u043c\u043e\u0436\u043d\u043e \u0437\u0430\u0431\u043b\u043e\u043a\u0438\u0440\u043e\u0432\u0430\u0442\u044c), \u043e\u043d\u0430 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0435\u0442\u0441\u044f \u043f\u043e\u0441\u0442\u043e\u044f\u043d\u043d\u043e. \u0423 <i>browser_action<\/i> \u0435\u0441\u0442\u044c \u043e\u0434\u043d\u043e \u043f\u0440\u0435\u0438\u043c\u0443\u0449\u0435\u0441\u0442\u0432\u043e \u043f\u043e \u0441\u0440\u0430\u0432\u043d\u0435\u043d\u0438\u044e \u0441 <i>page_action<\/i>, \u043f\u043e\u0432\u0435\u0440\u0445 \u0438\u043a\u043e\u043d\u043a\u0438 browser_action \u043c\u043e\u0436\u043d\u043e \u043d\u0430\u043f\u0438\u0441\u0430\u0442\u044c \u043f\u0430\u0440\u0443 \u043a\u0440\u0430\u0441\u0438\u0432\u044b\u0445 \u0441\u0438\u043c\u0432\u043e\u043b\u043e\u0432 (\u0443 \u043c\u0435\u043d\u044f \u0432\u043b\u0430\u0437\u0438\u0442 \u0442\u043e\u043b\u044c\u043a\u043e 4).<\/p>\n<p>  <img decoding=\"async\" src=\"http:\/\/habr.habrastorage.org\/post_images\/c15\/cdb\/b92\/c15cdbb928397f55279e7ae168e4416b.png\"\/><\/p>\n<p>  \u042f \u0432\u044b\u0431\u0440\u0430\u043b <i>browser_action<\/i>, \u043a\u0430\u043a \u043c\u043d\u0435 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u043d\u0435 \u0441 \u043e\u0434\u043d\u0438\u043c \u0441\u0430\u0439\u0442\u043e\u043c, \u0430 \u0441 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u0438\u043c\u0438. \u0418 \u0434\u0430, \u043d\u0430\u043d\u0435\u0441\u0435\u043d\u0438\u0435 \u043a\u0440\u0430\u0441\u0438\u0432\u044b\u0445 \u0441\u0438\u043c\u0432\u043e\u043b\u043e\u0432 \u043d\u0430 \u0438\u043a\u043e\u043d\u043a\u0443.<br \/>  \u0412\u043e\u0442 \u0447\u0442\u043e Google \u0433\u043e\u0432\u043e\u0440\u0438\u0442 \u043f\u043e \u044d\u0442\u043e\u043c\u0443 \u043f\u043e\u0432\u043e\u0434\u0443:<\/p>\n<blockquote><p>Do use page actions for features that make sense for only a few pages. <br \/>  Don&#8217;t use page actions for features that make sense for most pages. Use browser actions instead.   <\/p><\/blockquote>\n<p>  \u0418 \u0442\u0430\u043a, \u0447\u0442\u043e \u0431\u0443\u0434\u0435\u0442 \u0434\u0435\u043b\u0430\u0442\u044c \u043d\u0430\u0448\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435; \u0441\u043a\u0430\u0436\u0443 \u0441\u0440\u0430\u0437\u0443, \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0431\u0443\u0434\u0435\u0442 \u0434\u0430\u043b\u0435\u0435 \u043e\u043f\u0438\u0441\u0430\u043d\u043e, \u2014 \u044d\u0442\u043e \u043c\u0430\u043b\u0430\u044f \u0447\u0430\u0441\u0442\u044c \u0442\u043e\u0433\u043e \u0447\u0442\u043e \u0431\u044b\u043b\u043e \u0441\u0434\u0435\u043b\u0430\u043d\u043e \u0434\u043b\u044f \u043a\u043b\u0438\u0435\u043d\u0442\u0430. \u041a\u043e\u0433\u0434\u0430 \u043c\u0435\u043d\u0435\u0434\u0436\u0435\u0440 \u0437\u0430\u0445\u043e\u0434\u0438\u0442 \u043d\u0430 \u0441\u0430\u0439\u0442 <a href=\"http:\/\/hantim.ru\">hantim.ru<\/a> \u0434\u043b\u044f \u043f\u0440\u043e\u0441\u043c\u043e\u0442\u0440\u0430 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u0438 \u043e \u043a\u043e\u043d\u0442\u0440\u0430\u043a\u0442\u0435\/\u0432\u0430\u043a\u0430\u043d\u0441\u0438\u0438, \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043f\u0430\u0440\u0441\u0438\u0442 html \u043a\u043e\u0434 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u0438 \u043d\u0430\u0445\u043e\u0434\u0438\u0442 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044e (\u0432\u0430\u043a\u0430\u043d\u0441\u0438\u044f, \u0433\u043e\u0440\u043e\u0434 \u0438 \u0442\u0434). \u041f\u0440\u0438 \u043a\u043b\u0438\u043a\u0435 \u043d\u0430 \u0438\u043a\u043e\u043d\u043a\u0443 \u0440\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0438\u044f \u2014 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0435\u0442\u0441\u044f \u0444\u043e\u0440\u043c\u0430 \u043b\u043e\u0433\u0438\u043d\u0430, \u043a\u0443\u0434\u0430 \u043c\u0435\u043d\u0435\u0434\u0436\u0435\u0440 \u0432\u0432\u043e\u0434\u0438\u0442 \u0441\u0432\u043e\u0438 \u0434\u0430\u043d\u043d\u044b\u0435, \u0430 \u043f\u043e\u0442\u043e\u043c \u043c\u043e\u0436\u0435\u0442 \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0432\u044b\u0431\u0440\u0430\u043d\u043d\u0443\u044e \u0432\u0430\u043a\u0430\u043d\u0441\u0438\u044e\/\u043a\u043e\u043d\u0442\u0440\u0430\u043a\u0442 \u0432 \u0441\u0432\u043e\u0439 \u043f\u0440\u043e\u0444\u0438\u043b\u044c \u043d\u0430 \u043a\u043e\u0440\u043f\u043e\u0440\u0430\u0442\u0438\u0432\u043d\u043e\u043c \u0441\u0430\u0439\u0442\u0435.<\/p>\n<p>  \u0422\u0435\u043f\u0435\u0440\u044c \u043e \u0442\u043e\u043c \u043a\u0430\u043a \u0432\u0441\u0435 \u044d\u0442\u043e \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442. Google \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u043d\u0430\u043c \u0442\u0430\u043a\u0443\u044e \u043a\u0430\u0440\u0442\u0438\u043d\u0443: <br \/>  <img decoding=\"async\" src=\"http:\/\/habr.habrastorage.org\/post_images\/02e\/24e\/409\/02e24e409cadc89e4158f613a0951c12.png\"\/><\/p>\n<p>  1) Inspected window \u2014 \u044d\u0442\u043e \u0442\u043e \u0447\u0442\u043e \u043c\u044b \u043e\u0442\u043a\u0440\u044b\u043b\u0438 \u0432\u043e \u0432\u043a\u043b\u0430\u0434\u043a\u0435, content scripts \u2014 \u044d\u0442\u043e \u043d\u0430\u0448 script_in_content.js, \u043e\u043d \u0438\u043c\u0435\u0435\u0442 \u043f\u043e\u043b\u043d\u044b\u0439 \u0434\u043e\u0441\u0442\u0443\u043f \u043a DOM \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b.<br \/>  2) Background page \u2014 \u044d\u0442\u043e \u0441\u0435\u0440\u0434\u0446\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f, \u0432 \u043d\u0430\u0448\u0435\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u2014 \u044d\u0442\u043e background.html. <br \/>  3) DevTools page \u2014 \u044d\u0442\u043e \u0442\u043e, \u0447\u0442\u043e \u0431\u0443\u0434\u0435\u0442 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0442\u0441\u044f \u043f\u0440\u0438 \u043a\u043b\u0438\u043a\u0435 \u043d\u0430 \u0438\u043a\u043e\u043d\u043a\u0443 \u0440\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0438\u044f (login.html \u0438\u043b\u0438 find.html \u0432 \u043d\u0430\u0448\u0435\u043c \u0441\u043b\u0443\u0447\u0430\u0435).<\/p>\n<p>  \u0415\u0434\u0438\u043d\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0435 \u0447\u0442\u043e \u043c\u0435\u043d\u044f \u0441\u043c\u0443\u0449\u0430\u0435\u0442 \u0432 \u0434\u0430\u043d\u043d\u043e\u0439 \u043a\u0430\u0440\u0442\u0438\u043d\u043a\u0435 \u0442\u0430\u043a \u044d\u0442\u043e \u0441\u0432\u044f\u0437\u044c <b>DevTools page<\/b> \u0438 <b>Inspected window<\/b>. \u042f \u043d\u0435 \u043d\u0430\u0448\u0435\u043b \u0440\u0435\u0448\u0435\u043d\u0438\u044f, \u0447\u0442\u043e \u0431\u044b \u043f\u0435\u0440\u0435\u0434\u0430\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0435 \u0438\u0437 \u043e\u0434\u043d\u043e\u0439 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u0432 \u0434\u0440\u0443\u0433\u0443\u044e. \u041d\u043e \u0435\u0441\u043b\u0438 \u0432\u044b\u0441\u0442\u0430\u0432\u0438\u0442\u044c <b>Background page<\/b> \u043a\u0430\u043a \u043f\u043e\u0441\u0440\u0435\u0434\u043d\u0438\u043a\u0430, \u0438 \u0447\u0435\u0440\u0435\u0437 \u043d\u0435\u0433\u043e \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0439, \u0442\u043e \u0432\u0441\u0435 \u0437\u0430\u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442.<\/p>\n<p>  \u0418 \u0442\u0430\u043a, \u043d\u0430\u0441\u0442\u0430\u043b\u043e \u0432\u0440\u0435\u043c\u044f \u043a\u043e\u0434\u0430. \u041d\u0430\u0447\u043d\u0435\u043c \u0441 \u043d\u0435\u0432\u0438\u0434\u0438\u043c\u043e\u0439 \u0441\u0442\u043e\u0440\u043e\u043d\u044b.<\/p>\n<div class=\"spoiler\"><b class=\"spoiler_title\">background.html<\/b><\/p>\n<div class=\"spoiler_text\">\n<pre><code class=\"html\">&lt;!DOCTYPE html&gt; &lt;html&gt;     &lt;head&gt;         &lt;meta http-equiv=&quot;Content-Type&quot; content=&quot;text\/html; charset=UTF-8&quot;&gt;         &lt;script type=&quot;text\/javascript&quot; src=&quot;lib.js&quot;&gt;&lt;\/script&gt;         &lt;script type=&quot;text\/javascript&quot; src=&quot;bg.js&quot;&gt;&lt;\/script&gt;     &lt;\/head&gt;     &lt;body&gt;&lt;\/body&gt; &lt;\/html&gt; <\/code><\/pre>\n<p>  <\/div>\n<\/div>\n<p>  \u041d\u0430\u0434\u0435\u044e\u0441\u044c \u0441 \u044d\u0442\u0438\u043c \u0432\u043e\u043f\u0440\u043e\u0441\u043e\u0432 \u043d\u0435 \u0434\u043e\u043b\u0436\u043d\u043e \u0432\u043e\u0437\u043d\u0438\u043a\u043d\u0443\u0442\u044c. \u041e\u0434\u043d\u043e \u0437\u0430\u043c\u0435\u0447\u0430\u043d\u0438\u0435: \u00abbackground.html \u2014 \u0437\u0430\u0433\u0440\u0443\u0436\u0430\u0435\u0442\u0441\u044f \u0442\u043e\u043b\u044c\u043a\u043e \u043e\u0434\u0438\u043d \u0440\u0430\u0437 \u0437\u0430 \u0432\u0441\u0435 \u0432\u0440\u0435\u043c\u044f \u0440\u0430\u0431\u043e\u0442\u044b \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430, \u0430 \u0438\u043c\u0435\u0435\u043d\u043e \u043f\u0440\u0438 \u0435\u0433\u043e \u0437\u0430\u043f\u0443\u0441\u043a\u0435\u00bb. \u0417\u0434\u0435\u0441\u044c \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0443\u0432\u0438\u0434\u0435\u0442\u044c \u0447\u0442\u043e \u043c\u044b \u0437\u0430\u0433\u0440\u0443\u0436\u0430\u0435\u043c 2 js \u0444\u0430\u0439\u043b\u0430 (lib.js \u2014 \u043d\u0430\u0431\u043e\u0440 \u0444\u0443\u043d\u043a\u0446\u0438\u0439, bg.js \u2014 &#8216;\u0433\u043e\u043b\u043e\u0432\u0430&#8217; \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f).<\/p>\n<div class=\"spoiler\"><b class=\"spoiler_title\">bg.js<\/b><\/p>\n<div class=\"spoiler_text\">\n<pre><code class=\"javascript\">\/**  * OnLoad function  *   * @return void  *\/ window.onload = function(){      \/\/ tmp storage     window.bg = new bgObj();      \/\/ some variables  !!! important     window.bg.api_site_host = 'http:\/\/katran.by';      \/\/ get all graber hosts:   !!!once!!!     new Ajax({         url: window.bg.api_site_host+'\/regexp.php',         response: 'json',         async: false,         onComplete: function(data){             if(data && data.status && (data.status === 'ok'))                 window.bg.grabber_hosts = data.data;         }     }).send();      \/\/ set handler to tabs     chrome.tabs.onActivated.addListener(function(info) {         window.bg.onActivated(info);     });      \/\/ set handler to tabs:  need for seng objects     chrome.extension.onConnect.addListener(function(port){         port.onMessage.addListener(factory);     });      \/\/ set handler to extention on icon click     chrome.browserAction.onClicked.addListener(function(tab) {         window.bg.onClicked(tab);     });      \/\/ set handler to tabs     chrome.tabs.onUpdated.addListener(function(id, info, tab) {         \/\/ if tab load         if (info && info.status && (info.status.toLowerCase() === 'complete')){             \/\/ if user open empty tab or ftp protocol and etc.             if(!id || !tab || !tab.url || (tab.url.indexOf('http:') == -1))                 return 0;              \/\/ save tab info if need             window.bg.push(tab);              \/\/ connect with new tab, and save object             var port = chrome.tabs.connect(id);             window.bg.tabs[id].port_info = port;              \/\/ run function in popup.html             chrome.tabs.executeScript(id, {code:&quot;initialization()&quot;});              \/\/ send id, hosts and others information into popup.js             window.bg.tabs[id].port_info.postMessage({method:'setTabId', data:id});             window.bg.tabs[id].port_info.postMessage({method:'setHosts', data:window.bg.grabber_hosts});             window.bg.tabs[id].port_info.postMessage({method:'run'});              \/\/ if user is logged into application set find.html popup             if(window.bg.user.id)                 chrome.browserAction.setPopup({popup: &quot;find.html&quot;});         };     });      window.bg.onAppReady(); };   \/**  * Functino will be called when popup.js send some data by port interface  *   * @return void  *\/ function factory(obj){     if(obj && obj.method){         if(obj.data)             window.bg[obj.method](obj.data);         else             window.bg[obj.method]();     } }   \/**  * Popup object  *  * @version 2013-10-11  * @return  Object  *\/ window.bgObj = function(){ };   \/**  * Pablic methods  *\/ window.bgObj.prototype = {      \/**      * some internal params      *\/     tabs: {},     user: {},     popup_dom: {},     active_tab: {},     grabber_hosts: {},     done_urls: [],      \/**      * init() function      *\/     onAppReady: function()     {         \/\/ if user not logged into application set login.html popup         chrome.browserAction.setPopup({popup: &quot;login.html&quot;});     },      \/**      * Function add tab into $tabs object, if need      *\/     push: function(tab)     {         if(tab.id && (tab.id != 0)){             if(!this.tabs[tab.id])                 this.tabs[tab.id] = {tab_obj:tab};         }     },      \/**      * Function will be called from popup.js      *\/     mustParsed: function(data)     {         if(this.tabs[data.tab_id]){             var id = data.tab_id;             this.tabs[id].must_parsed = data.find;              \/\/ run parser in popup.js, if need             if(this.tabs[id].must_parsed && (this.tabs[id].must_parsed === true))                 this.tabs[id].port_info.postMessage({method:'parsePage'});         }     },      \/**      * Function will be called from popup.js      *\/     matchesCount: function(data)     {         if(data.tab_id && this.tabs[data.tab_id]){             var id = data.tab_id;             this.tabs[id].matches = data.matches;             this.tabs[id].matches_count = this.tabs[id].matches.length+'';              if(this.tabs[id].matches_count && this.tabs[id].matches_count != '0'){                 chrome.browserAction.setBadgeText({text: this.tabs[id].matches_count});                 return 0;             }         }          \/\/ show default text         chrome.browserAction.setBadgeText({text:''});     },      \/**      * Function will be called when user change active tab      *\/     onActivated: function(info)     {         \/\/ set active tab         this.active_tab = info;          var data = {};         data.matches  = [];          if(info.tabId){             data.tab_id  = info.tabId;             if(!this.tabs[data.tab_id])                 this.tabs[data.tab_id] = {};             if(!this.tabs[data.tab_id].matches)                 this.tabs[data.tab_id].matches = [];              data.matches = this.tabs[data.tab_id].matches;         }          \/\/ set actual count of matches for current tab         this.matchesCount(data);          \/\/ if user is logged into application set find.html popup         if(this.user.id)             chrome.browserAction.setPopup({popup: &quot;find.html&quot;});     },      \/**      * Function will be called when user click on extension icon      *\/     onClicked: function(tab)     {         alert('\u041f\u0440\u043e\u0438\u0437\u043e\u0448\u043b\u0430 \u043e\u0448\u0438\u0431\u043a\u0430. \u041e\u0431\u0440\u0430\u0442\u0438\u0442\u0435\u0441\u044c \u043a \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430\u043c \u0434\u0430\u043d\u043d\u043e\u0433\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f.');         return 0;     },      \/**      * Function will be called from login.js      *\/     loginUser: function(user_data)     {         var self = this;         var json_data = false;          \/\/ get all graber hosts:   !!!once!!!         new Ajax({             url: window.bg.api_site_host+'\/login.php?user='+encodeURIComponent(JSON.stringify(user_data)),             method: 'post',             response: 'json',             async: false,             onComplete: function(data){                 if(data && data.status){                     \/\/ if login - ok                     if(data.status === 'ok')                         self.user = data.data;                      json_data = data;                 }             }         }).send();          \/\/ return value for login.js         return json_data;     },      \/**      * Function will be called from login.js and others places      *\/     setPopup: function(popup_file)     {         chrome.browserAction.setPopup({tabId: this.active_tab.tabId, popup: popup_file});     },      \/**      * Function will be called from find.js and others places      *\/     getMatches: function()     {         \/\/ init if need         if(!this.tabs[this.active_tab.tabId])             this.tabs[this.active_tab.tabId] = {};         if(!this.tabs[this.active_tab.tabId].matches)             this.tabs[this.active_tab.tabId].matches = [];          \/\/ if user alredy send this url - remove         for(var i = 0, cnt = this.tabs[this.active_tab.tabId].matches.length; i &lt; cnt; i++){             for(var j = 0, len = this.done_urls.length; j &lt; len; j++){                 if(this.tabs[this.active_tab.tabId].matches[i].url === this.done_urls[j]){                     this.tabs[this.active_tab.tabId].matches[i].url = '';                     break;                 }             }         }          return this.tabs[this.active_tab.tabId].matches;     },      \/**      * Function will be called from find.js and others places      *\/     addUrlToGrabber: function(url)     {         \/\/ if $url == ''  -  already used         if(json_data.status && (json_data.status === 'ok')){             var matches = this.tabs[this.active_tab.tabId].matches;             for(var i = 0, cnt = matches.length; i &lt; cnt; i++){                 if(matches[i].url && (matches[i].url === url))                     matches[i].url = '';                     this.done_urls.push(url);             }         }          \/\/ return value for login.js         return json_data;     },       \/**      * Empty method      *\/     empty: function()     {     } } <\/code><\/pre>\n<p>  <\/div>\n<\/div>\n<p>  \u041f\u0435\u0440\u0432\u044b\u043c \u0434\u0435\u043b\u043e\u043c \u043c\u044b \u0434\u043e\u0436\u0438\u0434\u0430\u0435\u043c\u0441\u044f <i>window.onload<\/i>, \u043f\u043e\u0442\u043e\u043c \u043f\u043e\u0441\u044b\u043b\u0430\u0435\u043c \u0437\u0430\u043f\u0440\u043e\u0441 \u043d\u0430 katran.by (\u043f\u043e\u043b\u0443\u0447\u0438\u043c json \u0434\u0430\u043d\u043d\u044b\u0435, \u0441 \u043a\u0430\u043a\u043e\u0433\u043e \u0441\u0430\u0439\u0442\u0430 \u0438 \u043a\u0430\u043a\u0438\u043c RegExp&#8217;\u043f\u043e\u043c \u043c\u044b \u0434\u0430\u0441\u0442\u0430\u043d\u0435\u043c \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u044b\u0435 \u0434\u0430\u043d\u043d\u044b\u0435), \u043f\u043e\u0442\u043e\u043c \u0432\u0435\u0448\u0430\u0435\u043c handler&#8217;\u044b \u043d\u0430 \u0432\u043a\u043b\u0430\u0434\u043a\u0438 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430 (\u0434\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u043c\u044b \u0438 \u0443\u043a\u0430\u0437\u0430\u043b\u0438 \u0432 \u043c\u0430\u043d\u0438\u0444\u0435\u0441\u0442\u0435 permissions ~ tabs).<\/p>\n<pre><code class=\"javascript\">    chrome.tabs.onActivated.addListener(function(info) {         window.bg.onActivated(info);     }); <\/code><\/pre>\n<p>  <b>onActivated<\/b> \u2014 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u0442\u043e\u0433\u0434\u0430, \u043a\u043e\u0433\u0434\u0430 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u043f\u0435\u0440\u0435\u0448\u0435\u043b \u043d\u0430 \u043d\u043e\u0432\u0443\u044e \u0432\u043a\u043b\u0430\u0434\u043a\u0443 (\u043f\u043e \u043a\u043b\u0438\u043a\u0443 \u0438\u043b\u0438 \u043f\u043e alt+tab).<\/p>\n<pre><code class=\"javascript\">    chrome.tabs.onUpdated.addListener(function(id, info, tab) {         .....     }); <\/code><\/pre>\n<p>  <b>onUpdated<\/b> \u2014 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u0442\u043e\u0433\u0434\u0430, \u043a\u043e\u0433\u0434\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430 \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e (\u0437\u0430\u0433\u0440\u0443\u0437\u0438\u043b\u0441\u044f \u043d\u0435 \u0442\u043e\u043b\u044c\u043a\u043e DOM, \u0430 \u0438 \u0432\u0441\u0435 \u043a\u0430\u0440\u0442\u0438\u043d\u043a\u0438) \u0437\u0430\u0433\u0440\u0443\u0437\u0438\u043b\u0430\u0441\u044c \u0432\u043e \u0432\u043a\u043b\u0430\u0434\u043a\u0435.<\/p>\n<pre><code class=\"javascript\">    chrome.browserAction.onClicked.addListener(function(tab) {         window.bg.onClicked(tab);     }); <\/code><\/pre>\n<p>  <b>onClicked<\/b> \u2014 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u0442\u043e\u0433\u0434\u0430, \u043a\u043e\u0433\u0434\u0430 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u043a\u043b\u0438\u043a\u0430\u0435\u0442 \u043d\u0430 \u0438\u043a\u043e\u043d\u043a\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f. \u041d\u0435\u0431\u043e\u043b\u044c\u0448\u043e\u0435 \u0437\u0430\u043c\u0435\u0447\u0430\u043d\u0438\u0435, \u0435\u0441\u043b\u0438 \u0432\u043e \u0432\u0440\u0435\u043c\u044f \u043a\u043b\u0438\u043a\u0430 <b>default_popup<\/b> \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043b\u0435\u043d\u043e, \u0442\u043e \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a onClicked \u2014 \u043d\u0435 \u0437\u0430\u043f\u0443\u0441\u0442\u0438\u0442\u0441\u044f. <i>default_popup<\/i> \u044d\u0442\u043e html \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430 \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0431\u0443\u0434\u0435\u0442 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0435\u0442\u044c\u0441\u044f \u043f\u043e\u0441\u043b\u0435 \u043d\u0430\u0436\u0430\u0442\u0438\u044f \u043d\u0430 \u0438\u043a\u043e\u043d\u043a\u0443 \u0440\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0438\u044f. <i>default_popup<\/i> \u043c\u043e\u0436\u043d\u043e \u0432\u044b\u0441\u0442\u0430\u0432\u0438\u0442\u044c \u0432 \u043c\u0430\u043d\u0438\u0444\u0435\u0441\u0442\u0435, \u0430 \u0442\u0430\u043a \u0436\u0435 \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e <i>chrome.browserAction.setPopup({popup: \u00abfind.html\u00bb});<\/i> \u0438\u043b\u0438 <i>chrome.pageAction.setPopup({popup: \u00abfind.html\u00bb});<\/i><\/p>\n<pre><code class=\"javascript\">    chrome.extension.onConnect.addListener(function(port){         port.onMessage.addListener(factory);     }); <\/code><\/pre>\n<p>  \u042d\u0442\u0430 <s>\u0442\u0435\u043c\u043d\u0430\u044f \u043c\u0430\u0433\u0438\u044f<\/s> \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0446\u0438\u044f, \u043d\u0443\u0436\u043d\u0430 \u0434\u043b\u044f \u043f\u0440\u0438\u0435\u043c\u0430 \u0434\u0430\u043d\u043d\u044b\u0445, \u043f\u043e\u0441\u043b\u0430\u043d\u043d\u044b\u0445 \u043e\u0442 <i>script_in_content.js<\/i> \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e <b>port<\/b>.<br \/>  \u041e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u043e\u0439 \u0434\u0430\u043d\u043d\u044b\u0445 \u0437\u0430\u043d\u0438\u043c\u0430\u0435\u0442\u0441\u044f <b>factory(obj)<\/b><\/p>\n<pre><code class=\"javascript\">function factory(obj){     if(obj && obj.method){         if(obj.data)             window.bg[obj.method](obj.data);         else             window.bg[obj.method]();     } } <\/code><\/pre>\n<p>  \u0427\u0442\u043e \u0436\u0435 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u043a\u043e\u0433\u0434\u0430 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u0437\u0430\u0433\u0440\u0443\u0436\u0430\u0435\u0442 \u0432\u043a\u043b\u0430\u0434\u043a\u0443, \u0430 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0435\u0435:<\/p>\n<ul>\n<li>\u0412\u044b\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f handler <code>onUpdated<\/code> <\/li>\n<li><code>if (info && info.status && (info.status.toLowerCase() === 'complete'))<\/code> \u0435\u0441\u043b\u0438 \u0432\u0441\u0435 \u0437\u0430\u0433\u0440\u0443\u0436\u0435\u043d\u043e \u2014 \u043f\u0440\u043e\u0434\u043e\u043b\u0436\u0430\u0435\u043c \u0440\u0430\u0437\u0431\u043e\u0440 \u043f\u043e\u043b\u0435\u0442\u043e\u0432.<\/li>\n<li><code>if(!id || !tab || !tab.url || (tab.url.indexOf('http:') == -1))<\/code> \u0435\u0441\u043b\u0438 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u043e\u0442\u043a\u0440\u044b\u043b \u043d\u0435 web-\u0441\u0430\u0439\u0442 (\u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0443 \u043d\u0430 https \u2014 \u0437\u0430\u0431\u044b\u043b, \u0442\u043e\u043b\u044c\u043a\u043e \u0441\u0435\u0439\u0447\u0430\u0441 \u0437\u0430\u043c\u0435\u0442\u0438\u043b \ud83d\ude42 ), \u0430 \u043a \u043f\u0440\u0438\u043c\u0435\u0440\u0443 \u0432\u043a\u043b\u0430\u0434\u043a\u0443 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u0438\u043b\u0438 ftp \u0438 \u0442\u0434., \u0442\u043e \u043d\u0438\u0447\u0435\u0433\u043e \u043d\u0435 \u0434\u0435\u043b\u0430\u0435\u043c<\/li>\n<li><code>window.bg.push(tab);<\/code> \u2014 \u0441\u043e\u0437\u0440\u0430\u043d\u044f\u0435\u043c \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044e \u043e\u0431 \u0442\u0435\u043a\u0443\u0449\u0435\u0439 \u0432\u043a\u043b\u0430\u0434\u043a\u0435<\/li>\n<li><code>chrome.tabs.executeScript(id, {code:&quot;initialization()&quot;});<\/code> \u2014 \u0441\u0435\u0439\u0447\u0430\u0441 \u043c\u044b \u043f\u0440\u0438\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c <i>script_in_content.js<\/i> \u0432\u044b\u043f\u043e\u043b\u043d\u0438\u0442\u044c \u0444\u0443\u043d\u043a\u0446\u0438\u044e <i>initialization()<\/i><\/li>\n<li><code>window.bg.tabs[id].port_info.postMessage({method:'setTabId', data:id})<\/code> \u2014 \u043c\u044b \u043f\u043e\u0441\u044b\u043b\u0430\u0435\u043c \u0434\u0430\u043d\u043d\u044b\u0435 \u0432 <i>script_in_content.js<\/i><\/li>\n<li><code>chrome.browserAction.setPopup({popup: &quot;find.html&quot;});<\/code> \u2014 \u0443\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0435\u043c popup \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443, \u0435\u0441\u043b\u0438 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u0430\u0432\u0442\u043e\u0440\u0438\u0437\u043e\u0432\u0430\u043b\u0441\u044f \u0440\u0430\u043d\u0435\u0435<\/li>\n<\/ul>\n<p>  \u0415\u0441\u0442\u044c 2 \u0441\u043f\u043e\u0441\u043e\u0431\u0430 \u043f\u0435\u0440\u0435\u0434\u0430\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0435 \u043e\u0442 <i>background.html<\/i> \u043a <i>script_in_content.js<\/i>:  <\/p>\n<ol>\n<li><b>\u0441hrome.tabs.executeScript(integer tabId, InjectDetails details, function callback)<\/b> \u2014 \u043e\u0434\u043d\u043e \u043d\u043e, \u0442\u0430\u043a\u0438\u043c \u0441\u043f\u043e\u0441\u0430\u0431\u043e\u043c \u043c\u043e\u0436\u043d\u043e \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u0432 \u0432\u0438\u0434\u0435 \u0441\u0442\u0440\u043e\u043a\u0438 (\u043d\u0435 \u043e\u0431\u044a\u0435\u043a\u0442, \u043d\u0435 \u043c\u0430\u0441\u0441\u0438\u0432)<\/li>\n<li><b>\u0441hrome.tabs.sendMessage(integer tabId, any message, function responseCallback)<\/b> \u2014 \u0442\u0430\u043a \u043c\u043e\u0436\u043d\u043e \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0442\u044c \u0447\u0442\u043e \u0443\u0433\u043e\u0434\u043d\u043e, \u043f\u0440\u0430\u0432\u0434\u043e \u043f\u043e\u0442\u0440\u0435\u0431\u0443\u044e\u0442\u0441\u044f \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043d\u044b\u0435 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 <\/li>\n<\/ol>\n<p>  \u0418 \u0442\u0430\u043a, \u043c\u044b \u043f\u043e\u0441\u043b\u0430\u043b\u0438 \u0434\u0430\u043d\u043d\u044b\u0435 \u0432 script_in_content.js, \u0437\u043d\u0430\u0447\u0438\u0442 \u043d\u0430\u0441\u0442\u0430\u043b\u043e \u0432\u0440\u0435\u043c\u044f \u0440\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c \u0435\u0433\u043e \u043a\u043e\u0434.<\/p>\n<div class=\"spoiler\"><b class=\"spoiler_title\">script_in_content.js<\/b><\/p>\n<div class=\"spoiler_text\">\n<pre><code class=\"javascript\">\/\/ set handler to tabs:  need for seng objects to backgroung.js chrome.extension.onConnect.addListener(function(port){     port.onMessage.addListener(factory); });   \/**  * Function remove spaces in begin and end of string  *  * @version 2012-11-05  * @param   string  str  * @return  string  *\/ function trim(str) {     return String(str).replace(\/^\\s+|\\s+$\/g, ''); }   \/**  * Functino will be called from background.js  *   * @return void  *\/ function initialization(){     window.popup = new popupObj(); }   \/**  * Functino will be called when background.js send some data by port interface  *   * @return void  *\/ function factory(obj){     if(obj && obj.method){         if(obj.data)             window.popup[obj.method](obj.data);         else             window.popup[obj.method]();     } }   \/**  * Popup object  *  * @version 2013-10-11  * @return  Object  *\/ window.popupObj = function(){ };   \/**  * Pablic methods  *\/ window.popupObj.prototype = {      \/**      * some internal params      *\/     available_hosts: [],     total_host: null,     matches: [],     tab_id: null,     port: null,     cars: [],      \/**      * Function will be called from bg.js      *\/     setHosts: function(hosts)     {         this.available_hosts = hosts;     },      \/**      * Function will be called from bg.js      *\/     setTabId: function(id)     {         this.tab_id = id;     },      \/**      * Function check total host      *\/     run: function()     {         \/\/ get total host         if(document.location.host && (document.location.host != ''))             this.total_host = document.location.host;         else if(document.location.hostname && (document.location.hostname != ''))             this.total_host = document.location.hostname;          if(!this.total_host || (this.total_host === ''))             return 0;          var find = false;         \/\/ if total host in array $available_hosts - parse page for finde cars         for (host in this.available_hosts) {             if(this.total_host.indexOf(host) != -1){                 this.total_host = host;                 find = true;                 break;             }         };          \/\/ create connection to backgroung.html and send request         this.port = chrome.extension.connect();         this.port.postMessage({method:'mustParsed', data:{tab_id:this.tab_id, find:find}});     },      \/**      * Function will be called from bg.js      * Parse page      *\/     parsePage: function()     {         \/\/ reset variable before parse         this.matches = [];          if(!this.available_hosts[this.total_host])             return 0;          var html = window.document.body.innerHTML;         var reg_exp = this.available_hosts[this.total_host];         var matches = {};         var match = [];         var find = false;         for(var i = 0, len = reg_exp.length; i &lt; len; i++) {             var exp = new RegExp(reg_exp[i].reg_exp, reg_exp[i].flag);             match = exp.exec(html);              if(match && match.length && reg_exp[i].index){                 matches[reg_exp[i].field] = trim(match[reg_exp[i].index]);                 find = true;             }             else if(match && match.length){                 matches[reg_exp[i].field] = match;                 find = true;             }         }          \/\/ this url will be send to site         if(find === true){             matches.url = document.location.href;             this.matches.push(matches);         }          \/\/ send count of matches         this.port.postMessage({method:'matchesCount', data:{tab_id:this.tab_id, matches: this.matches}});     } } <\/code><\/pre>\n<p>  <\/div>\n<\/div>\n<p>  \u041f\u0435\u0440\u0432\u043e\u0435 \u0447\u0442\u043e \u0431\u0440\u043e\u0441\u0430\u0435\u0442\u0441\u044f \u0432 \u0433\u043b\u0430\u0437\u0430 \u2014 \u044d\u0442\u043e \u043f\u0440\u0438\u0435\u043c \u0434\u0430\u043d\u043d\u044b\u0445 \u043e\u0442 background.html, \u043a\u0430\u043a \u043c\u043e\u0436\u0435\u0442\u0435 \u0437\u0430\u043c\u0435\u0442\u0438\u0442\u044c \u043e\u043d \u0442\u0430\u043a\u043e\u0439 \u0436\u0435 \u043a\u0430\u043a \u0438 \u0432 bg.js: <\/p>\n<pre><code class=\"javascript\">chrome.extension.onConnect.addListener(function(port){     port.onMessage.addListener(factory); }); <\/code><\/pre>\n<p>  \u041a\u0430\u043a \u043f\u043e\u043c\u043d\u0438\u0442\u0435, \u0440\u0430\u043d\u0435\u0435 \u0432 <b>bg.js<\/b> \u043c\u044b \u0437\u0430\u043f\u0443\u0441\u0442\u0438\u043b\u0438 <code>initialization()<\/code>, <code>setTabId()<\/code>, <code>setHosts()<\/code> \u0438 <code>run()<\/code>. \u041d\u0430\u0439\u0431\u043e\u043b\u044c\u0448\u0438\u0439 \u0438\u043d\u0442\u0435\u0440\u0435\u0441 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 window.popup.run(). \u0422\u0430\u043c \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u0442\u0441\u044f \u0434\u043e\u043c\u0435\u043d\u043d\u043e\u0435 \u0438\u043c\u044f \u0441\u0435\u0440\u0432\u0435\u0440\u0430 \u043e\u0442\u043a\u0440\u044b\u0442\u043e\u0439 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b, \u0438 \u0435\u0441\u043b\u0438 \u044d\u0442\u043e \u0438\u043c\u044f \u0441\u043e\u0432\u043f\u0430\u0434\u0430\u0435\u0442 \u0441\u043e \u0441\u043f\u0438\u0441\u043a\u043e\u043c \u0441\u0430\u0439\u0442\u043e\u0432 \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043d\u0430\u043c \u0438\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u044b (\u0434\u0430\u043d\u043d\u044b\u0435 \u0441 \u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u043f\u0435\u0440\u0435\u0434\u0430\u0442\u044c \u043d\u0430 \u043a\u043e\u0440\u043f\u043e\u0440\u0430\u0442\u0438\u0432\u043d\u044b\u0439 \u0440\u0435\u0441\u0443\u0440\u0441) \u2014 <code>find = true;<\/code> \u0438 \u043e\u0442\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u043c \u0437\u0430\u043f\u0440\u043e\u0441 <code>window.bg.mustParsed(obj)<\/code> \u0432 <b>bg.js<\/b>. <\/p>\n<pre><code class=\"javascript\">    \/**      * Function will be called from script_in_content.js      *\/     mustParsed: function(data)     {         if(this.tabs[data.tab_id]){             var id = data.tab_id;             this.tabs[id].must_parsed = data.find;              \/\/ run parser in popup.js, if need             if(this.tabs[id].must_parsed && (this.tabs[id].must_parsed === true))                 this.tabs[id].port_info.postMessage({method:'parsePage'});         }     } <\/code><\/pre>\n<p>  \u0415\u0441\u043b\u0438 \u0441\u043e\u0432\u043f\u0430\u0434\u0435\u043d\u0438\u0435 \u0434\u043e\u043c\u0435\u043d\u0430 \u0431\u044b\u043b\u043e \u043d\u0430\u0439\u0434\u0435\u043d\u043e, \u0442\u043e \u0437\u0430\u043f\u0443\u0441\u043a\u0430\u0435\u043c \u043f\u0430\u0440\u0441\u0435\u0440 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b <code>parsePage()<\/code> \u0432 <i>script_in_content.js<\/i>.<\/p>\n<pre><code class=\"javascript\">    \/**      * Function will be called from bg.js      * Parse page      *\/     parsePage: function()     {         \/\/ reset variable before parse         this.matches = [];          if(!this.available_hosts[this.total_host])             return 0;          var html = window.document.body.innerHTML;         var reg_exp = this.available_hosts[this.total_host];         var matches = {};         var match = [];         var find = false;         for(var i = 0, len = reg_exp.length; i &lt; len; i++) {             var exp = new RegExp(reg_exp[i].reg_exp, reg_exp[i].flag);             match = exp.exec(html);              if(match && match.length && reg_exp[i].index){                 matches[reg_exp[i].field] = trim(match[reg_exp[i].index]);                 find = true;             }             else if(match && match.length){                 matches[reg_exp[i].field] = match;                 find = true;             }         }          \/\/ this url will be send to site         if(find === true){             matches.url = document.location.href;             this.matches.push(matches);         }          \/\/ send count of matches         this.port.postMessage({method:'matchesCount', data:{tab_id:this.tab_id, matches: this.matches}});     } <\/code><\/pre>\n<p>  \u0415\u0441\u043b\u0438 \u0441\u043a\u0440\u0438\u043f\u0442 \u0447\u0442\u043e-\u0442\u043e \u043d\u0430\u0448\u0435\u043b \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435, \u0442\u043e \u0432\u0441\u0435 \u0447\u0442\u043e \u043e\u043d \u043d\u0430\u0448\u0435\u043b \u0441\u043a\u043b\u0430\u0434\u044b\u0432\u0430\u0435\u0442 \u0432 \u043c\u0430\u0441\u0441\u0438\u0432\u0447\u0438\u043a, \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u0442 \u043a \u043d\u0435\u043c\u0443 \u0442\u0435\u043a\u0443\u0449\u0438\u0439 url \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u0438 \u043e\u0442\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u0442 \u043d\u0430\u0437\u0430\u0434 \u0432 <b>bg.js<\/b>, \u043c\u043e\u043b: \u00ab\u0421\u043c\u043e\u0442\u0440\u0438 \u0447\u0442\u043e \u044f \u043d\u0430\u0448\u0435\u043b&#8230;\u00bb. \u0412 \u043e\u0442\u0432\u0435\u0442 \u043d\u0430 \u044d\u0442\u043e, <b>bg.js<\/b> \u0430\u043d\u0430\u043b\u0438\u0437\u0438\u0440\u0443\u0435\u0442 \u0432\u0445\u043e\u0434\u043d\u044b\u0435 \u0434\u0430\u043d\u043d\u044b\u0435, \u0438 \u0435\u0441\u043b\u0438 RegExp&#8217;\u044b \u043d\u0430\u0448\u043b\u0438 \u0447\u0442\u043e-\u0442\u043e \u2014 \u043f\u0438\u0448\u0435\u0442 \u043f\u043e\u0432\u0435\u0440\u0445 \u0438\u043a\u043e\u043d\u043a\u0438 \u043a\u043e\u043b\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e \u0441\u043e\u0432\u043f\u0430\u0434\u0435\u043d\u0438\u0439 (1, 2 \u0438 \u0442\u0434.) <code>chrome.browserAction.setBadgeText({text: this.tabs[id].matches_count});<\/code>. <\/p>\n<p>  \u042d\u0442\u043e \u0432\u0440\u043e\u0434\u0435 \u0432\u0441\u0435 \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u043c\u043e\u043c\u0435\u043d\u0442\u044b \u0440\u044b\u0431\u043e\u0442\u044b \u0441\u0432\u044f\u0437\u043a\u0438 <b>bg.js<\/b> \u0438 <b>script_in_content.js<\/b>.<br \/>  \u0422\u0435\u043f\u0435\u0440\u044c \u043f\u043e\u0433\u043e\u0432\u043e\u0440\u0438\u043c \u043e <b>popup<\/b>. \u041a\u043e\u0433\u0434\u0430 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u043a\u043b\u0438\u043a\u0430\u0435\u0442 \u043f\u043e \u0438\u043a\u043e\u043d\u043a\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u2014 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0435\u0442\u0441\u044f \u0444\u043e\u0440\u043c\u0430 <i>login.html<\/i>.<br \/>  \u041c\u0435\u043d\u0435\u0434\u0436\u0435\u0440 \u0432\u0432\u043e\u0434\u0438\u0442 \u0441\u0432\u043e\u0438 \u0434\u0430\u043d\u043d\u044b\u0435 \u043e\u0442 \u043a\u043e\u0440\u043f\u043e\u0440\u0430\u0442\u0438\u0432\u043d\u043e\u0433\u043e \u0441\u0430\u0439\u0442\u0430, \u043d\u0430\u0436\u0438\u043c\u0430\u0435\u0442 Login \u0438 \u0442\u0443\u0442 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0435\u0435:<\/p>\n<div class=\"spoiler\"><b class=\"spoiler_title\">login.html<\/b><\/p>\n<div class=\"spoiler_text\">\n<pre><code class=\"html\">&lt;!DOCTYPE html&gt; &lt;html&gt;     &lt;head&gt;         &lt;meta   http-equiv=&quot;content-type&quot; content=&quot;text\/html; charset=UTF-8&quot;&gt;         &lt;script type=&quot;text\/javascript&quot;    src=&quot;login.js&quot;&gt;&lt;\/script&gt;         &lt;link   type=&quot;text\/css&quot;           rel=&quot;stylesheet&quot; href=&quot;login.css&quot;&gt;         &lt;title&gt;Grabber popup&lt;\/title&gt;     &lt;\/head&gt;     &lt;body&gt;         &lt;div class=&quot;body&quot;&gt;             &lt;div class=&quot;emptyLogin&quot;&gt;                 &lt;div id=&quot;error_message&quot;&gt;&nbsp;&lt;\/div&gt;                 &lt;form name=&quot;login_form&quot; action=&quot;&quot; method=&quot;get&quot; id=&quot;popup_login_form&quot;&gt;                     &lt;table&gt;                         &lt;tbody&gt;                             &lt;tr&gt;                                 &lt;td align=&quot;right&quot;&gt;\u0412\u0430\u0448 E-mail:&lt;\/td&gt;                                 &lt;td&gt;&lt;input type=&quot;text&quot; name=&quot;login&quot; value=&quot;&quot; tabindex=&quot;1&quot;&gt;&lt;\/td&gt;                             &lt;\/tr&gt;                             &lt;tr&gt;                                 &lt;td align=&quot;right&quot;&gt;\u041f\u0430\u0440\u043e\u043b\u044c:&lt;\/td&gt;                                 &lt;td&gt;&lt;input type=&quot;password&quot; name=&quot;pass&quot; value=&quot;&quot; tabindex=&quot;2&quot;&gt;&lt;\/td&gt;                             &lt;\/tr&gt;                             &lt;tr&gt;                                 &lt;td colspan=&quot;2&quot; align=&quot;center&quot;&gt;&lt;input type=&quot;submit&quot; value=&quot;Login&quot; class=&quot;button&quot;&gt;&lt;\/td&gt;                             &lt;\/tr&gt;                         &lt;\/tbody&gt;                     &lt;\/table&gt;                 &lt;\/form&gt;             &lt;\/div&gt;             &lt;div id=&quot;loader&quot;&gt;&lt;img src=&quot;ajax-loader.gif&quot; title=&quot;Loding&quot; alt=&quot;Loading&quot;&gt;&lt;\/div&gt;         &lt;\/div&gt;     &lt;\/body&gt; &lt;\/html&gt; <\/code><\/pre>\n<p>  <\/div>\n<\/div>\n<p>  <\/p>\n<div class=\"spoiler\"><b class=\"spoiler_title\">login.js<\/b><\/p>\n<div class=\"spoiler_text\">\n<pre><code class=\"javascript\">\/**  * OnLoad function  *   * @return void  *\/ window.onload = function(){      \/\/ set some events handlers     document.getElementById('popup_login_form').onsubmit = function(obj){         \/\/ fade popup         document.getElementById('loader').style.display = 'block';         document.getElementById('error_message').innerHTML = '&nbsp;';          if(obj.target.elements && obj.target.elements.length && (obj.target.elements.length === 3)){             var data = {};             data.login = obj.target.elements[0].value;             data.pass  = obj.target.elements[1].value;              setTimeout(function(){                 var bg_wnd = chrome.extension.getBackgroundPage();                 var result = bg_wnd.bg.loginUser(data);                  if(result && result.status && (result.status === 'error'))                     document.getElementById('error_message').innerHTML = result.mess;                 else{                     \/\/ set new popup html code and close popup window                     bg_wnd.bg.setPopup('find.html');                     window.close();                 }                  \/\/ hide fade on popup                 document.getElementById('loader').style.display = 'none';             }, 500);         }         return false;     }; } <\/code><\/pre>\n<p>  <\/div>\n<\/div>\n<p>  \u0417\u0430\u0434\u0430\u0447\u0430 <b>login.js<\/b> \u0441\u043e\u0441\u0442\u043e\u0438\u0442 \u0432 \u0442\u043e\u043c, \u0447\u0442\u043e \u0431\u044b \u043f\u043e\u0432\u0435\u0441\u0438\u0442\u044c <code>onsubmit<\/code> \u043d\u0430 \u0444\u043e\u0440\u043c\u0443, \u0438 \u043e\u0442\u043f\u0440\u0430\u0432\u0438\u0442\u044c \u043b\u043e\u0433\u0438\u043d\/\u043f\u0430\u0440\u043e\u043b\u044c \u0432 <i> background.html (bg.js)<\/i>,<br \/>  \u0430 \u0434\u0435\u043b\u0430\u0435\u0442\u0441\u044f \u044d\u0442\u043e \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0435\u0439 \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0446\u0438\u0438 (\u043a\u0430\u043a \u0443\u0432\u0438\u0434\u0438\u0442\u0435, \u043c\u044b \u043f\u043e\u0436\u0435\u043c \u043d\u0430 \u043f\u0440\u044f\u043c\u0443\u044e \u0432\u044b\u0437\u044b\u0432\u0430\u0442\u044c \u043c\u0435\u0442\u043e\u0434\u044b \u043e\u0431\u044a\u0435\u043a\u0442\u0430 <i>bg.js<\/i>): <\/p>\n<pre><code class=\"javascript\">                var bg_wnd = chrome.extension.getBackgroundPage();                 var result = bg_wnd.bg.loginUser(data); <\/code><\/pre>\n<p>  <code>bg_wnd.bg.loginUser(data)<\/code> \u043e\u0442\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u0442 \u0434\u0430\u043d\u043d\u044b\u0435 \u043d\u0430 \u0441\u0435\u0440\u0432\u0435\u0440, \u0435\u0441\u043b\u0438 \u0432\u0441\u0435 \u0445\u043e\u0440\u043e\u0448\u043e, \u0442\u043e popup <i>login.html<\/i> \u0441\u043c\u0435\u043d\u044f\u0435\u0442 <i>find.html<\/i>, <br \/>  \u0430 \u0434\u0430\u043d\u043d\u044b\u0435 \u043e \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u0435 \u0441\u043e\u0445\u0440\u0430\u043d\u044f\u044e\u0442\u0441\u044f \u0432 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0439. \u0421\u043c\u0435\u043d\u0430 popup \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c:<\/p>\n<pre><code class=\"javascript\">    \/**      * Function will be called from login.js and others places      *\/     setPopup: function(popup_file)     {         chrome.browserAction.setPopup({tabId: this.active_tab.tabId, popup: popup_file});     }, <\/code><\/pre>\n<p>  \u041d\u0435\u0431\u043e\u043b\u044c\u0448\u043e\u0435 \u0437\u0430\u043c\u0435\u0447\u0430\u043d\u0438\u0435, \u0435\u0441\u043b\u0438 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u043e\u0442\u043a\u0440\u044b\u043b popup <i>login.html<\/i> \u043f\u043e\u0441\u0442\u0430\u0432\u0438\u043b \u043a\u0443\u0440\u0441\u043e\u0440 \u0432 \u043f\u043e\u043b\u0435 &#8216;\u0412\u0430\u0448 E-mail:&#8217; \u0438 \u043d\u0430\u0436\u0438\u043c\u0430\u0435\u0442 <b>TAB<\/b> (\u043f\u0435\u0440\u0432\u044b\u0439 \u0440\u0430\u0437) \u0432 \u043d\u0430\u0434\u0435\u0436\u0434\u0435 \u043f\u0435\u0440\u0435\u0439\u0442\u0438 \u043a \u043f\u0430\u0440\u043e\u043b\u044e, \u0442\u043e \u0435\u0433\u043e \u043e\u0436\u0438\u0434\u0430\u0435\u0442 \u0440\u0430\u0437\u0430\u0447\u0430\u0440\u043e\u0432\u0430\u043d\u0438\u0435, \u0444\u043e\u043a\u0443\u0441 \u043d\u0435 \u0441\u043c\u0435\u043d\u0438\u0442\u0441\u044f. \u0414\u0430\u043d\u043d\u044b\u0439 <a href=\"https:\/\/code.google.com\/p\/chromium\/issues\/detail?id=122352\">\u0431\u0430\u0433<\/a> \u0432\u0441\u0435 \u0435\u0449\u0435 \u0430\u043a\u0442\u0443\u0430\u043b\u0435\u043d.<\/p>\n<p>  \u0422\u0430\u043a, \u043e\u0441\u0442\u0430\u043b\u043e\u0441\u044c \u0441\u043e\u0432\u0441\u0435\u043c \u0447\u0443\u0442\u044c-\u0447\u0443\u0442\u044c.<br \/>  \u041f\u043e\u0441\u043b\u0435 \u0442\u043e\u0433\u043e \u043a\u0430\u043a \u043c\u044b \u0443\u0441\u043f\u0435\u0448\u043d\u043e \u0430\u0432\u0442\u043e\u0440\u0438\u0437\u043e\u0432\u0430\u043b\u0438\u0441\u044c, \u043c\u044b \u043f\u043e\u043c\u0435\u043d\u044f popup \u043d\u0430 <i>find.html<\/i>.<\/p>\n<div class=\"spoiler\"><b class=\"spoiler_title\">find.html<\/b><\/p>\n<div class=\"spoiler_text\">\n<pre><code class=\"html\">&lt;!DOCTYPE html&gt; &lt;html&gt;     &lt;head&gt;         &lt;meta   http-equiv=&quot;content-type&quot; content=&quot;text\/html; charset=UTF-8&quot;&gt;         &lt;script type=&quot;text\/javascript&quot;    src=&quot;find.js&quot;&gt;&lt;\/script&gt;         &lt;link   type=&quot;text\/css&quot;           rel=&quot;stylesheet&quot; href=&quot;find.css&quot;&gt;         &lt;title&gt;Grabber&lt;\/title&gt;     &lt;\/head&gt;     &lt;body&gt;         &lt;div class=&quot;body&quot;&gt;             &lt;div class=&quot;carsRows&quot; id=&quot;popup_cars_rows&quot;&gt;                 &lt;h3 style=&quot;text-align: center; margin: 5px 0;&quot;&gt;\u041d\u0430\u0439\u0434\u0435\u043d\u043d\u044b\u0435 \u0434\u0430\u043d\u043d\u044b\u0439 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435&lt;\/h3&gt;                 &lt;form name=&quot;cars_form&quot; action=&quot;&quot; method=&quot;get&quot; id=&quot;popup_cars_form&quot;&gt;                     &lt;table id=&quot;popup_cars_table&quot;&gt;                         &lt;thead&gt;                             &lt;tr&gt;                                 &lt;th class=&quot;make&quot;&gt;\u0412\u0430\u043a\u0430\u043d\u0441\u0438\u044f&lt;\/th&gt;                                 &lt;th class=&quot;info&quot;&gt;\u0413\u043e\u0440\u043e\u0434&lt;\/th&gt;                                 &lt;th class=&quot;addBtn&quot;&gt;&nbsp;&lt;\/th&gt;                             &lt;\/tr&gt;                         &lt;\/thead&gt;                         &lt;tbody&gt;                         &lt;\/tbody&gt;                     &lt;\/table&gt;                 &lt;\/form&gt;             &lt;\/div&gt;             &lt;div class=&quot;carsRows&quot; id=&quot;popup_cars_rows_none&quot; style=&quot;display: none;&quot;&gt;                 &lt;h3 style=&quot;text-align: center; margin: 5px 0;&quot;&gt;\u041d\u0438\u0447\u0435\u0433\u043e \u043d\u0435 \u043d\u0430\u0439\u0434\u0435\u043d\u043e \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435&lt;\/h3&gt;             &lt;\/div&gt;             &lt;div id=&quot;loader&quot;&gt;&lt;img src=&quot;ajax-loader.gif&quot; title=&quot;Loding&quot; alt=&quot;Loading&quot;&gt;&lt;\/div&gt;         &lt;\/div&gt;     &lt;\/body&gt; &lt;\/html&gt; <\/code><\/pre>\n<p>  <\/div>\n<\/div>\n<p>  <\/p>\n<div class=\"spoiler\"><b class=\"spoiler_title\">find.js<\/b><\/p>\n<div class=\"spoiler_text\">\n<pre><code class=\"javascript\">\/**  * OnLoad function  *   * @return void  *\/ window.onload = function(){      \/\/ set new popup html code and close popup window     window.bg_wnd = chrome.extension.getBackgroundPage();     var rows = window.bg_wnd.bg.getMatches();      \/\/ function render popup     renderPopup(rows); }   \/**  * Function set cars into html  *  * @param  array  $rows  * @return void  *\/ function renderPopup(rows) {     if(rows.length === 0){         document.getElementById('popup_cars_rows').style.display = 'none';         document.getElementById('popup_cars_rows_none').style.display = 'block';         return 0;     }     else{         document.getElementById('popup_cars_rows').style.display = 'block';         document.getElementById('popup_cars_rows_none').style.display = 'none';     }      for (var i = 0, cnt = rows.length; i &lt; cnt; i++)         renderRow(rows[i]); }   \/**  * Function set cars into html  *  * @param  object $row  * @return void  *\/ function renderRow(row) {     var tbl = document.getElementById('popup_cars_table').children[1];      \/\/ add divided row     var td = tbl.insertRow(-1).insertCell(-1);     td.setAttribute('colspan', '3');     td.innerHTML = '&lt;hr style=&quot;border: 1px solid #909090; width: 75%&quot;&gt;';      var tr = tbl.insertRow(-1);     var td1 = tr.insertCell(-1);     var td2 = tr.insertCell(-1);     var td3 = tr.insertCell(-1);     var vacancy = [];     var city    = [];      var hash = {         vacancy: '\u0432\u0430\u043a\u0430\u043d\u0441\u0438\u044f',         city: '\u0433\u043e\u0440\u043e\u0434',     }      var table_row = [];     for(key in row){         if(hash[key]){             if(key == 'vacancy')                 vacancy.push(row[key]);             if(key == 'city')                 city.push(row[key]);         }     }      td1.innerHTML = vacancy.join(' ');;     td2.innerHTML = city.join(' ');     td3.innerHTML = (row.url === '')?'&lt;b&gt;&lt;em&gt;\u0414\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u043e&lt;\/em&gt;&lt;\/b&gt;':'&lt;input type=&quot;button&quot; value=&quot;\u0414\u0430\u0431\u0430\u0432\u0438\u0442\u044c&quot; name=&quot;cars[]&quot; class=&quot;button&quot;&gt;&lt;input type=&quot;hidden&quot; value=&quot;'+row.url+'&quot; name=&quot;url[]&quot;&gt;';     td3.children[0].addEventListener('click', function(){addToGrabber(event)}, false); }   function addToGrabber(e) {     \/\/ hide fade on popup     document.getElementById('loader').getElementsByTagName('img')[0].style.marginTop = (window.innerHeight\/2-10)+'px';     document.getElementById('loader').style.display = 'block';      if(e && e.srcElement){         var url = e.srcElement.parentNode.children[1].value;          setTimeout(function(){             var result = window.bg_wnd.bg.addUrlToGrabber(url);             e.srcElement.parentNode.innerHTML = '&lt;b&gt;&lt;em&gt;\u0414\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u043e&lt;\/em&gt;&lt;\/b&gt;';              \/\/ hide fade on popup             document.getElementById('loader').style.display = 'none';         }, 500);     } } <\/code><\/pre>\n<p>  <\/div>\n<\/div>\n<p>  \u041a\u0430\u043a \u0442\u043e\u043b\u044c\u043a\u043e <i>find.html<\/i> \u0437\u0430\u0433\u0440\u0443\u0437\u0438\u043b\u0441\u044f, \u0432 \u0440\u0430\u0431\u043e\u0442\u0443 \u0432\u0441\u0442\u0443\u043f\u0430\u0435\u0442 <i>find.js<\/i>. \u0415\u0433\u043e \u0437\u0430\u0434\u0430\u0447\u0430 \u0441\u043f\u0440\u043e\u0441\u0438\u0442\u044c bg.js: &#8216;\u0427\u0442\u043e \u0442\u0430\u043c \u0443 \u0442\u0435\u0431\u044f \u0435\u0441\u0442\u044c \u043d\u0430 \u0442\u0435\u043a\u0443\u0449\u0443\u044e \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443&#8217; \u2014 \u0438 \u043e\u0442\u043e\u0431\u0440\u0430\u0437\u0438\u0442\u044c \u0442\u043e, \u0447\u0442\u043e \u043e\u0442\u0434\u0430\u043b <i>bg.js<\/i>.<\/p>\n<pre><code class=\"javascript\">\/**  * OnLoad function  *   * @return void  *\/ window.onload = function(){      \/\/ set new popup html code and close popup window     window.bg_wnd = chrome.extension.getBackgroundPage();     var rows = window.bg_wnd.bg.getMatches();      \/\/ function render popup     renderPopup(rows); } <\/code><\/pre>\n<p>  \u0422\u0430\u043a \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u0433\u043e\u0442\u043e\u0432\u043e\u0435 \u0440\u0435\u0448\u0435\u043d\u0438\u0435.<\/p>\n<p>  <img decoding=\"async\" src=\"http:\/\/habrastorage.org\/storage3\/6c7\/fde\/8ff\/6c7fde8ff8bf7260a7054863a99013aa.png\"\/><\/p>\n<p>  C \u043a\u043d\u043e\u043f\u043a\u043e\u0439 &#8216;\u0414\u043e\u0431\u0430\u0432\u0438\u0442\u044c&#8217; \u044f \u0434\u0443\u043c\u0430\u044e \u0441\u0430\u043c\u0438 \u0440\u0430\u0437\u0431\u0435\u0440\u0435\u0442\u0435\u0441\u044c, \u043a\u0430\u043a \u043e\u043d\u0430 \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442. \u041d\u0430 \u043f\u043e\u0441\u043b\u0435\u0434\u043e\u043a \u0445\u043e\u0447\u0443 \u0441\u043a\u0430\u0437\u0430\u0442\u044c \u043a\u0430\u043a \u0432\u0441\u0435 \u044d\u0442\u043e \u0434\u0435\u043b\u043e \u043e\u0442\u043b\u0430\u0436\u0438\u0432\u0430\u0435\u0442\u0441\u044f.<br \/>  <b>background.html<\/b> \u2014 \u0447\u0442\u043e \u0431\u044b \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c \u0440\u0430\u0431\u043e\u0442\u0443 \u0441\u043a\u0440\u0438\u043f\u0442\u043e\u0432 <i>bg.js <\/i>\u0438 <i>lib.js<\/i> \u043d\u0443\u0436\u043d\u043e \u043a\u043b\u0438\u043a\u043d\u0443\u0442\u044c \u043d\u0430 \u043b\u0438\u043d\u043a\u0443 <i>background.html<\/i> \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 <i>chrome:\/\/extensions<\/i>.<br \/>  <img decoding=\"async\" src=\"http:\/\/habrastorage.org\/storage3\/abf\/69d\/f0d\/abf69df0dee0f58b89d4e7185a19782b.png\"\/><br \/>  <b>script_in_content.js<\/b> \u2014 \u043e\u043d \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u0435\u0442\u0441\u044f \u0432 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0435 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u043c\u043e\u0436\u0435\u0442\u0435 \u0441\u043c\u0435\u043b\u043e \u0438\u043d\u0441\u043f\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443 \u0438 \u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c \u043a\u043e\u043d\u0441\u043e\u043b\u044c \u0441 \u0432\u044b\u0432\u043e\u0434\u043e\u043c \u043e\u0448\u0438\u0431\u043e\u043a \u0432 \u043d\u0435\u0435.<br \/>  <b>login.html<\/b> \u0438 <b>find.html<\/b> \u2014 \u0447\u0442\u043e \u0431\u044b \u0432\u044b\u0432\u0435\u0441\u0442\u0438 \u0438\u0445 Developer Tools, \u043d\u0443\u0436\u043d\u043e \u043a\u043b\u0438\u043a\u043d\u0443\u0442\u044c \u043d\u0430 \u0438\u043a\u043e\u043d\u043a\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0438 \u043f\u0440\u0430\u0432\u044b\u043c \u043a\u043b\u0438\u043a\u043e\u043c \u043c\u044b\u0448\u043a\u0438 \u0432\u044b\u0431\u0440\u0430\u0442\u044c \u0438\u043d\u0441\u043f\u0435\u043a\u0446\u0438\u044e \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b.<br \/>  <img decoding=\"async\" src=\"http:\/\/habrastorage.org\/storage3\/dfc\/9b8\/05d\/dfc9b805d1ca2049d426aed5205f8c0b.png\"\/><\/p>\n<p>  PS. \u0412\u0435\u0441\u044c JavaScript \u0434\u043e\u043b\u0436\u0435\u043d \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u0432 js \u0444\u0430\u0439\u043b\u0430\u0445, \u0435\u0441\u043b\u0438 \u0432\u044b \u0435\u0433\u043e \u0432\u0441\u0442\u0430\u0432\u0438\u0442\u0435 \u0432 html \u2014 chrome \u0431\u0443\u0434\u0435\u0442 \u0440\u0443\u0433\u0430\u0442\u044c\u0441\u044f.<br \/>  \u0422\u0430\u043a\u0436\u0435 \u043f\u0430\u0440\u0443 \u0441\u0441\u044b\u043b\u043e\u043a:<br \/>  \u043d\u0430 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u044e: <a href=\"http:\/\/developer.chrome.com\/trunk\/extensions\/manifest.html\">manifest.json<\/a>, <a href=\"http:\/\/developer.chrome.com\/extensions\/api_index.html\">Chrome&#8217;s API<\/a><br \/>  \u043d\u0430 github.com: <a href=\"https:\/\/github.com\/mamchyts\/chrome_extension\">\u0438\u0441\u0445\u043e\u0434\u043d\u044b\u0439 \u043a\u043e\u0434<\/a>    \t<\/p>\n<div class=\"clear\"><\/div>\n<\/p><\/div>\n<p> \u0441\u0441\u044b\u043b\u043a\u0430 \u043d\u0430 \u043e\u0440\u0438\u0433\u0438\u043d\u0430\u043b \u0441\u0442\u0430\u0442\u044c\u0438 <a href=\"http:\/\/habrahabr.ru\/post\/198778\/\"> http:\/\/habrahabr.ru\/post\/198778\/<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<div class=\"content html_format\">   \t\u0412 \u043e\u0434\u0438\u043d \u043f\u0440\u0435\u043a\u0440\u0430\u0441\u043d\u044b\u0439 \u0434\u0435\u043d\u044c, \u0437\u0430 \u043f\u0430\u0440\u0443 \u0447\u0430\u0441\u043e\u0432 \u0434\u043e \u043a\u043e\u043d\u0446\u0430 \u0440\u0430\u0431\u043e\u0442\u044b, \u043c\u043d\u0435 \u043f\u0440\u0438\u0445\u043e\u0434\u0438\u0442 \u0437\u0430\u0434\u0430\u0447\u0430: \u00ab\u041d\u0443\u0436\u043d\u043e \u043d\u0430\u043f\u0438\u0441\u0430\u0442\u044c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0434\u043b\u044f \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0434\u043e\u043b\u0436\u043d\u043e \u043f\u043e \u043a\u043b\u0438\u043a\u0443 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f \u043e\u0442\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0435 \u0441\u043e \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u043d\u0430 \u0441\u0430\u0439\u0442 \u043a\u043b\u0438\u0435\u043d\u0442\u0430. \u0427\u0442\u043e \u0437\u0430 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0438 \u043a\u0430\u043a\u043e\u0439 \u0431\u0440\u0430\u0443\u0437\u0435\u0440 \u2014 \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e \u043d\u0430 \u0432\u0430\u0448 \u0432\u044b\u0431\u043e\u0440&#8230;\u00bb.<\/p>\n<p>  \u041d\u0435\u043c\u043d\u043e\u0433\u043e \u043f\u043e\u0440\u0430\u0437\u043c\u044b\u0441\u043b\u0438\u0432 \u044f \u043f\u0440\u0438\u0448\u0435\u043b \u043a \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u0443 <b>google chrome extension<\/b>:<\/p>\n<ul>\n<li>Crome \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442 <b>Chromium<\/b> \u0434\u0432\u0438\u0436\u043e\u043a, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0444\u043e\u0440\u043a\u043e\u043c <b>WebKit<\/b> (\u0430 \u044d\u0442\u043e Safari), \u0442\u0430\u043a \u0436\u0435 \u043d\u0435 \u0437\u0430\u0431\u044b\u0432\u0430\u0435\u043c <b>Blink<\/b> (\u0430 \u044d\u0442\u043e \u0443\u0436\u0435 \u043d\u043e\u0432\u0430\u044f (\u0445\u043e\u0442\u044f \u044f \u0432\u0441\u0435 \u0435\u0449\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e \u0441\u0442\u0430\u0440\u0443\u044e \u0441 bookmarks&#8217;\u0430\u043c\u0438) Opera). \u0422\u0430\u043a\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c, \u043d\u0430\u043f\u0438\u0441\u0430\u0432 \u0440\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0438\u044f \u0434\u043b\u044f chrome, \u043c\u044b \u0441 \u043c\u0438\u043d\u0438\u043c\u0430\u043b\u044c\u043d\u044b\u043c\u0438 \u043f\u0435\u0440\u0435\u0434\u0435\u043b\u043a\u0430\u043c\u0438 (\u0430 \u0442\u043e \u0438 \u0431\u0435\u0437 \u043d\u0438\u0445) \u0441\u043c\u043e\u0436\u0435\u043c \u0435\u0433\u043e \u043f\u043e\u0440\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043d\u0430 \u0435\u0449\u0435 2 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430 <\/li>\n<li>\u041d\u0435\u0442 \u043e\u043f\u044b\u0442\u0430 \u0440\u0430\u0431\u043e\u0442\u044b \u0441 API Google Chrome<\/li>\n<li><b>Google<\/b> \u0432\u0441\u0435-\u0442\u0430\u043a\u0438 \u043a\u043e\u043c\u043f\u0430\u043d\u0438\u044f <b>\u0434\u043e\u0431\u0440\u0430<\/b> \ud83d\ude42<\/li>\n<\/ul>\n<p>  \u041a\u043e\u0433\u0434\u0430 \u043c\u044b\u0441\u043b\u0438 \u043d\u0435\u043c\u043d\u043e\u0433\u043e \u0443\u043b\u0435\u0433\u043b\u0438\u0441\u044c, \u043f\u0435\u0440\u0432\u043e\u0435 \u0447\u0442\u043e \u044f \u0441\u0434\u0435\u043b\u0430\u043b \u2014 \u044d\u0442\u043e \u0432\u0432\u0435\u043b \u0432 \u043f\u043e\u0438\u0441\u043a\u0435 \u0445\u0430\u0440\u0431\u0430 &quot;<i>\u0440\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0438\u0435 Google Chrome<\/i>&quot;. \u0423\u0432\u0438\u0434\u0435\u0432 \u043e\u0431\u0448\u0438\u0440\u043d\u044b\u0439 \u0432\u0430\u0440\u0438\u0430\u043d\u0442 \u0441\u0442\u0430\u0442\u0435\u0439 \u043f\u043e \u0434\u0430\u043d\u043d\u043e\u0439 \u0442\u0435\u043c\u0435, \u044f \u0441\u043e \u0441\u043f\u043e\u043a\u043e\u0439\u043d\u043e\u0439 \u0434\u0443\u0448\u043e\u0439 \u0443\u0448\u0435\u043b \u0434\u043e\u043c\u043e\u0439 \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e \u0443\u0432\u0435\u0440\u0435\u043d\u043d\u044b\u0439 \u0432 \u0442\u043e\u043c, \u0447\u0442\u043e \u0437\u0430\u0432\u0442\u0440\u0430 \u0441 \u0443\u0442\u0440\u0430 \u043f\u0440\u043e\u0447\u0438\u0442\u0430\u0432 \u0438\u0445, \u043a \u043a\u043e\u043d\u0446\u0443 \u0440\u0430\u0431\u043e\u0447\u0435\u0433\u043e \u0434\u043d\u044f \u0434\u0435\u043b\u043e \u0431\u0443\u0434\u0435\u0442 &#8216;<b>\u0432 \u0448\u043b\u044f\u043f\u0435<\/b>&#8216; (\u043a\u0430\u043a \u0436\u0435 \u044f \u0442\u043e\u0433\u0434\u0430 \u043e\u0448\u0438\u0431\u0430\u043b\u0441\u044f). \u041f\u0440\u043e\u0447\u0438\u0442\u0430\u0432 \u043f\u0430\u0440\u043e\u0447\u043a\u0443 \u0438\u0445 \u043d\u0438\u0445 \u044f \u0438\u043c\u0435\u043b \u043e\u0431\u0449\u0435\u0435 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u043e \u0442\u043e\u043c \u043a\u0430\u043a \u044d\u0442\u043e \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442, \u043d\u043e \u044d\u0442\u043e\u0433\u043e \u043e\u043a\u0430\u0437\u0430\u043b\u043e\u0441\u044c \u043c\u0430\u043b\u043e \u0434\u043b\u044f \u0432\u043e\u043f\u043b\u0430\u0449\u0435\u043d\u0438\u044f \u043c\u043e\u0438\u0445 \u0438\u0434\u0435\u0439. \u0427\u0442\u043e \u0436, \u043f\u0440\u0438\u0441\u0442\u0443\u043f\u0438\u043c\u2026  <\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[],"tags":[],"class_list":["post-198778","post","type-post","status-publish","format-standard","hentry"],"_links":{"self":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/198778","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=198778"}],"version-history":[{"count":0,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/198778\/revisions"}],"wp:attachment":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=198778"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=198778"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=198778"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}