1.manifest介绍界面：json格式

json：JavaScript Object Notation

包括两种结构：

key:value对：{{"A1":"value1","A2":"value2","A3":"value3"},{…},{…}}

值的有序集合 {"books":["book1","book2","book3"]}

value类型：字符串，数字，对象，数组，bool类型和null中的一种

json格式的数据可嵌套

2.DOM:document object model

DOM参阅：

http://www.ituring.com.cn/article/60188

http://www.w3school.com.cn/htmldom/

分为核心DOM，XML DOM和HTML DOM

HTML DOM的树状结构图：

每个文件有一个根元素<html>

每个根元素有两个子元素<head><body>

标签必须成对出现或者是自闭标签，嵌套关系必须明确

标签可以包含一些属性或者子节点，子节点可以是元素也可以是文本，如：

<img src="data:images/dog.png" />

<div>Hello World!</div>

<input type="text" id="stu_name" value="Billy" />

上面的input有type，id和value三个属性

type="text"表示是文本输出框

id="stu_name"表明给这个元素分配了一个名为stu_name的id

value="Billy"表示输入框的默认值为Billy

不同元素往往拥有不同的属性名，比如对于img元素，通常会包含src属性以指定所显示图片的地址，而input元素往往会包含type属性来描述输入框的类型。

js中有多种获取DOM元素的方法：

getElementById:通过id获取元素（HTML中元素的id唯一）

getElementsByName：通过name获取元素

getElementsByTagName：通过标签名获取元素

getElementsByClass:通过类名获取元素

后三种获得的是一个包含一个或多个元素的数组（必须是数组）

getAttribute：读取元素属性

setAttribute：添加或更改元素属性

removeAttribute：删除元素属性

var imgurl = document.getElementById('my_image').src;

document.getElementById('my_another_image').src = imgurl;

CSS的选择器：tagName，.className，#id

p {

    width: 200px;　　//p标签的宽度为200px

}

.postlist {

    width: 150px;　　//postlist类的元素宽为150px

}

#footer {

   width: 100px;　　//id为footer的元素宽度为100px

}

CSS选择器还可以通过元素属性进行定位

input[type="text"]{

　　font-size:16px;

}　　//作用于所有文本输入框

3.跨域请求：通过XMLHttpRequest请求数据时禁止跨域

需要在Manifest的permissions属性中声明需要的权限

注意：阻塞函数与非阻塞函数

大多数API调用为非阻塞函数，因此要用回调函数传递结果

如：function httpRequest(url,callback)(url为传入网址，callback为处理传回数据的函数）

问题：传回的数据安全起见不能直接用innerHTML插入或eval执行

若将数据写入：使用innerText

若是json格式的数据：使用JSON.parse解析     ？

结合try-catch判定数据的格式    ？

4.常驻后台

注意：js的格式：函数除定义外，调用时记得加；

加入background域即可

我的第一个chrome扩展（2）——基本知识的更多相关文章

  1. 我的第一个chrome扩展（1）——读样例，实现时钟

    学习chrome扩展开发: 与网页类似,需要的知识:html,javascript chrome扩展程序的构成: manifest.json:对扩展程序的整体描述文件 { "manifest ...

  2. 如何用原生js开发一个Chrome扩展程序

    原文地址:How to Build a Simple Chrome Extension in Vanilla JavaScript 开发一个Chrome扩展程序非常简单,只需要使用原生的js就可以完成 ...

  3. 如何通过写一个chrome扩展启动本地程序

    @(编程) [toc] 本文介绍如何利用Chrome 的插件, 从我们的一个网站中启动一个我们的本地程序.本文的环境是windows10,本文的例子是通过点击网页上的一个button,调用本地的wor ...

  4. 如何开发一个chrome扩展

    chrome是一个不错的浏览器,web开发者工作中一般都会使用chrome做为默认浏览器,它有很多扩展,给浏览器补充了各种功能,增强了用户体验.chrome具体能干什么?怎么做出来的呢? chrome ...

  5. 推荐一个Chrome扩展应用，能够自动去除CSDN广告

    作为一个程序员,每天编程遇到问题时,少不了前往国内著名的CSDN网站上查信息,看是否有同行遇到类似问题.很多时候根据遇到问题的错误消息进行搜索,结果都是一篇篇CSDN博客.这些博客打开后都会显示很多广 ...

  6. 跟我一起写一个chrome扩展程序

    在我没有看这本书之前,我都想象不到,原来chrome扩展程序可以这样写,真的非常有意思. 就是用最简单最基础的代码,然后就实现了一些非常有意思的玩意儿. 先看效果图 实际运用要和现实联系在一起,经历和 ...

  7. 自己写一个chrome扩展程序 - 右键菜单扩展

    最近在学习Spring,心想dotnet如何实现类似形式呢.于是想认真学习Casetle组件,发现没有书籍!而spring的书多得很.于是只好找网上教程了.发现系统的文章不多.Terrylee好多文章 ...

  8. 我的第一个chrome扩展（0）——目标

    当前有两个方向: 一.实现一个自动解码的地址栏监视器 扩展程序在后台不断监视地址栏输入,地址栏输入并回车后检查输入,若输入符合解码条件则调用网站信息进行解码,并将结果输出到地址栏,否则不改变: 初始阶 ...

  9. 我的第一个chrome扩展（3）——继续读样例

    1.操作用户正在浏览的界面 http://www.ituring.com.cn/article/60212 问题:1.google未定义ID,用name为何无法找到? 2.如何让整个按钮一起动?原函数 ...

随机推荐

  1. 【maven 报错】maven项目update之后报错One or more constraints have not been satisfied.

    在右键项目Update Project之后报错:One or more constraints have not been satisfied.Spring 4.1 requires Java 1.6 ...

  2. Spring的循环依赖问题

    spring容器循环依赖包括构造器循环依赖和setter循环依赖,那Spring容器如何解决循环依赖呢?首先让我们来定义循环引用类: 在Spring中将循环依赖的处理分成了3种情况: 构造器循环依赖 ...

  3. mysql死锁问题

    形成死锁的条件 我们mysql用的存储引擎是innodb,从日志来看,innodb主动探知到死锁,并回滚了某一苦苦等待的事务. 问题来了,innodb是怎么探知死锁的? 直观方法是在两个事务相互等待时 ...

  4. js:数据结构笔记7--哈希表

    哈希表(散列表):通过哈希函数将键值映射为一个字典; 哈希函数:依赖键值的数据类型来构建一个哈希函数: 一个基本的哈希表:(按字符串计算键值) function HashTable() { this. ...

  5. zoj 1097 普吕弗序列

    题目大意:输入一颗无根树的括号序列,求这棵树的普吕弗序列. 分析思路: 1)普吕弗序列,可以参考维基百科,其做法是找出树中编号最小的叶子节点,并将此叶子节点及边删除,并输出其邻接的节点标号: 2)递归 ...

  6. POJ 2117 (割点+连通分量)

    题目链接: http://poj.org/problem?id=2117 题目大意:在一个非连通图中,求一个切除图中任意一个割点方案,使得图中连通分量数最大. 解题思路: 一个大陷阱,m可以等于0,这 ...

  7. NOIP201103瑞士轮

    试题描述 [背景]在双人对决的竞技性比赛,如乒乓球.羽毛球.国际象棋中,最常见的赛制是淘汰赛和循环赛.前者的特点是比赛场数少,每场都紧张刺激,但偶然性较高.后者的特点是较为公平,偶然性较低,但比赛过程 ...

  8. 使用STL map 用 string 做索引 插入删除数据

    1.代码 #include <map> #include <string> #include <stdio.h> #include <vector> # ...

  9. url上使用#号好不好

    这是一篇摘自百度站长工具的文章. 一般来说,url当中的#号是一个锚点的标志位,这样的url打开之后会将访问者的视线定位在指定位置上,令访问者直接看到网页中间的一段内容.自从推特流行开始,#号被附予了 ...

  10. 网页制作常见的问题（怎样兼容IE6/IE7/火狐浏览器）

    1.IE6双边距问题? 在IE6的浏览器中明明设置的是10px的margin却为什么显示的是20px的margin其实这个Ie6的一个双边距BUG 例如: <style type="t ...