zoukankan      html  css  js  c++  java
  • 我的第一个chrome扩展(2)——基本知识

    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="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域即可

  • 相关阅读:
    js通过class获取元素时的兼容性解决方案
    html5的八大特性
    typeof与instanceof的区别
    evel()与JSON.parset()的区别
    apt-get出现的问题
    Linux下开启计划任务日志
    ls
    win10自带IE上不了网的解决办法
    crontab -e文件存放路径
    Linux系统下面crontab选择默认编译器
  • 原文地址:https://www.cnblogs.com/giddens/p/4513120.html
Copyright © 2011-2022 走看看