Javascript DOM编程艺术笔记

Author Avatar
Aryb1n 5月 23, 2017

addLoadEvent [p83]

可以用于添加n个函数到onload后执行

function addLoadEvent(func) {
    var oldLoad = window.onload;
    if(typeof window.onload != 'function') {
        window.onload = func;
    } else {
        window.onload = function() {
            oldLoad();
            func();
        }
    }

}

[p87]

几个知识点

function showPic(whichpic) {
    if(!document.getElementById('placeholder'))
        return false;
    var source = whichpic.getAttribute('href');
    var placeholder = document.getElementById('placeholder');
    if(placeholder.nodeName != 'IMG') // point1
        return false;
    placeholder.setAttribute('src', source);
    if(document.getElementById('description')) {
        var text = whichpic.getAttribute('title') ? whichpic.getAttribute('title') : '';
        var description = document.getElementById('description');
        if(description.firstChild.nodeType == 3) { //point
            description.firstChild.nodeValue = text;
        }
    }
}

point1: nodeName的返回结果总是大写形式,即使在HTML文档里是小写
point2: 文本节点的nodeType是3

DOM Core && HTML-DOM

getElementById
getElementByTagName
getAttribute
setAttribute

这些方法都是DOM Core的组成部分.并不专属于JavaScript,支持DOM的任何一种程序设计语言都可以使用它们
有好多属性属于HTML-DOM,在DOM Core出现之前很久就为人们所熟悉了

document.getElementByTagName('form')

就等价于HTML-DOM里的

document.forms

HTML-DOM中还提供了很多描述HTML元素的属性比如

element.getAttribute('src')

等价于

element.src

再比如

element.setAttribute('href', src)
element.href = src

结构与行为分离越大越好

document.write [p98]

从某种意义上讲, document.write方法有点像<font>标签里设定字体一样,不够优雅
好像说的有道理,但在某些题目中好像是可以绕过一些东西来着
这个时候想到了这个方法和文档流的一些问题,比如什么情况下,会发生清空body内容的情况

另外书中提到

document.write()innerHTML都是HTML的专有属性/方法,不能用于MIME类型为application/xhtml+xml的XHTML文档

DOM 方法

createElement

appendChild

createTextNode

后来

感觉这本书不错
我好想再补一下鹅厂javascript设计模式那本书

##