浏览器家园

TAG标签|网站导航| 手机访问:m.liulanqi.com

当前位置:首页360浏览器 → 360极速浏览器开发范例:从Hello World入门

360极速浏览器开发范例:从Hello World入门

时间:2023-06-27 10:49:20来源:整理作者:浏览器知识手机版

这个指南会带领您完整的创建一个简单的应用(扩展)。这个应用(扩展)会在360浏览器极速版中增加一个按钮。当点击按钮时,显示一个自动生成的页面。这个按钮和页面看起来如下图:

创建并加载一个应用

在这一节中,将编写一个browser action应用,这个应用会在360浏览器极速版的工具栏上增加一个图标。

1.在磁盘上创建一个目录,用来放应用的代码和资源

2.在这个目录中,创建一个文本文件,命名为manifest.json,其内容为:

{
“name”: “My First Extension”,
“version”: “1.0”,
“description”: “The first extension that I made.”,
“browser_action”: {
“default_icon”: “icon.png”
},
“permissions”: [
“http://api.flickr.com/”
]
}

3.把这个图标放到目录中:

4.加载应用(扩展)

a)点击图标,在菜单中选择工具〉扩展程序,这会打开扩展管理的页面

b)如果“开发人员模式”旁边有个“+”号,点击这个“+”号进入开发人员模式。“+”号会变成“-”号,同时会显示更多的按钮和信息

c)点击“载入正在开发的扩展程序…”按钮,会出现一个文件选择对话框

d)在对话框中,找到扩展目录并点击“确定”

如果应用(扩展)是正确的,它的图标就会显示在地址栏右侧,应用(扩展)的信息也会显示在扩展管理页面上,如下图所示:

向应用(扩展)中添加代码

在这一节,会给应用(扩展)增加一点功能

1.编辑manifest.json文件,增加下面的内容:


“browser_action”: {
“default_icon”: “icon.png”,
“popup”: “popup.html”
},

在应用(扩展)目录中,创建一个名为popup.html的文本文件,增加一些代码:CSS and JavaScript code for hello_world

2.回到扩展管理页面,点击“立即更新扩展程序”按钮,这时会重新加载修改后的应用(扩展)

3.点击应用(扩展)的图标,会弹出一个气泡窗口,显示popup.html文件的内容。样子如下:

如果看不到这个气泡,请严格按照上面的步骤重新做一遍。注意如果尝试加载应用(扩展)目录之外的任何html文件都会失败。

相关文章

  • 谷歌浏览器地图,谷歌浏览器地图:探索未知之地

    介绍谷歌浏览器地图作为全球最受欢迎的地图应用之一,被广泛应用于出行、旅游、探险等领域。它不仅可以实现地图导航功能,还能够提供卫星地图、街景地图和实时交通等丰富的地图信息,近几年来在全球范围内都受到了极高的关注和好评。在这篇文章中,我们将带大家一起探索谷歌浏览器地图的未知之地。2.常见功能谷歌浏览器地图不仅提供最基本的地图展示功能,还包括导航、路线规划、交通状况、公交查询等常见功能。用户可以根据自己的需求进行定制化设置,大大提高了出行的效率和便利性。此外,谷歌浏览器地图还支持语音导航、实时路况和离线地图..
  • 默认浏览器哪里找,找默认浏览器重写:50字以内

    默认浏览器怎么找:详解Windows、macOS和移动设备设置1.Windows操作系统设置默认浏览器Windows操作系统将InternetExplorer作为默认浏览器,但可以轻松更改为其他浏览器:Step1:打开“控制面板”,选择“程序”选项。Step2:单击“默认程序”。Step3:在“Web浏览器”下,选择您想要作为默认浏览器的程序。2.macOS操作系统设置默认浏览器类似于Windows,macOS操作系统也使用Safari作为默认浏览器,但同样可以更改:Step1:打开Safari并单击“S..

Copyright 2019-2029 www.liulanqi.com 【浏览器家园】 版权所有

浏览器家园_下载浏览器就到浏览器家园 | 专注MAC浏览器和Windows浏览器下载和使用介绍

声明: 所有软件和文章收集整理来自互联网 如有异议 请与本站联系 本站为非赢利性网站 不接受任何赞助和广告