首页 > 网站 > WEB开发 > 正文

[JS] JavaScript由浅入深(1) 基本特性

2024-04-27 14:07:17
字体:
来源:转载
供稿:网友

[JS] javaScript由浅入深(1) 基本特性

1.全局变量的特性:

  在函数体内直接写的变量(未用var标志)自动升级为全局变量。

        (function func() {            i = 100;        }());        alert(i);

  非常不建议不写var.

        var num = 1;        (function func() {            i = 100;        }());        delete i;        delete num;        if (typeof i != "undefined") alert(i);        if (typeof num != "undefined") alert(num);

  

2.DOM操作

  a.什么是DOM(Document Object Model),文档对象模型。包括元素节点,文本节点,属性节点和注释节点。

  b.DOM操作:

        HTML:write(),innerHTML,innerText,getElementById()

        CSS:

    <div>text</div>    <script>        var e = document.getElementsByTagName('div')[0];        e.style.background = 'blue';    </script>

        Event:事件有4种添加方式。

        所有事件:事件

3.异常:

try {     throw 'exception happend';} catch (e) {      alert(e);} 

  

4.类型:

  JS中5种基本类型:string number boolean undefined null  和一个复杂类型:object

  注意:

    typeof null 是object。

    因为null类型只有一个值null,null即代表一个类型,又代表一个空对象的指针。

    因为undefined类型只有一个值undefined,undefined代表一个类型,又代表一个未定义的变量.

  

    typeof Object 是function

    Object Function String都是构造函数。(推荐以后构造函数名Pascal命名,方法Camel命名)

5.内置对象

  JS中有7个Number String Date Array Boolean Math RegExp默认构造函数。通过new关键字,可以定义对应的对象。

  注意:

    PRototype是用来向对象添加属性和方法。

    constructor是指向函数本身的指针。

6.事件

事件流:

  事件流是指在页面中接受事件的顺序。

  事件冒泡指从最具体的节点到最不具体的节点,事件捕获和事件冒泡完全相反。

事件对象:

  触发DOM事件时,会产生事件对象。

  type:事件类型      target:相当于sender      stopPropagation():阻止事件冒泡    preventDefault():阻止事件默认行为(如:a标签默认点击跳转事件)

添加事件:

  addEventListener(事件名,函数,是否冒泡)

  attachEvent(on事件名,函数)

  on事件 = 函数

a.直接在html上

    <div onclick="func()">text</div>    <script>          function func() {            //todo          }    </script>

b.DOM0级处理

    <div >text</div>    <script>        var e = document.getElementsByTagName('div')[0];        e.onclick = func;        function func() {            //todo        }    </script>

c.DOM2级处理

    <div >text</div>    <script>        var e = document.getElementsByTagName('div')[0];        e.addEventListener('click', func);        function func() {            //todo        }    </script>

d.IE8以下

    <div >text</div>    <script>        var e = document.getElementsByTagName('div')[0];        a.attachEvent('onclick', func);        function func() {            //todo        }    </script>

  

7.BOM

  BOM(BrowserObjectModel)浏览器对象模型。

  包括:window,timing,history,location,screen

window:

  window对象代表浏览器窗口。DOM节点属于window对象的一个属性。所有的全局变量自动成为window对象的一个属性。

timing:

    <div>text</div>    <div>text</div>    <script>        setInterval(function () {            var e = getDivs()[0];            e.innerHTML = new Date().toLocaleString();        }, 500);        setTimeout(function() {            var e = getDivs()[1];            e.innerHTML = new Date().toLocaleString();        }, 500);        function getDivs() {            return document.getElementsByTagName('div');        }    </script>

8.DOM控制HTML:

  增:document.createElement(tagName);

  删:element.removeChild(element);

  改:element.setAttribute(attrName, attrValue);

  查:

    document.getElementById(elementId);    element.parentNode;    element.childNodes;

    document.getAttribute(attrName);

9.prototype(原型)

  除了基本类型外,都有prototype属性。

  prototype(包括原型链)中的属性会直接继承到对象上。

  

10.call和apply

  当用call和apply调用方法时,方法中的this可以由我们指定。

        function func(a, b) {            this.sum = a + b;            return this;        }        var o1 = {};        var o2 = {};        func.call(o1, 3, 5);        func.apply(o2, [3, 4]);        alert(o1.sum);        alert(o2.sum);

时间:

  GMT(Greenwich Mean Time)——格林尼治标准时间,世界基准时间

  UTC 这几个字母是英文Coordinated Universal Time 和法语Temp UniverselleCoordinee 的混合体。世界时。原子时。


发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表