笔记：优化、动态创建标记

笔记：优化、动态创建标记

事件处理

1. 检查是否理解DOM方法、元素是否存在等

   if (!document.getElementByID） return false;
   if (!document.getElementByID("imagegallery")) return false;

2. 变量名

创建变量来简化，并且把值储存在变量之中。

1. 遍历元素
2. 改变行为

共享onload事件

让函数在网页加载完毕后立即执行。加载完毕会触发onload事件。

弹性最佳解决方案：创建addLoadEvent函数

function addLoadEvent(func){
                var oldonload = window.onload;
                if(typeof window.onload!='function'){
                        window.onload = func;
                }
                else{
                    window.onload = function() {
                        oldonload();
                        func();
                    }
                }
        }
//使用方法
addLoadEvent(firstFunction);
addLoadEvent(secondFunction);

动态创建标记

ducument.write和innerHTML区别

document.write会将页面上的所有内容清除包括标题，而innerHTML只会重写所属元素的内容。

createElement方法和appendChild方法

当用createElement方法创建一个新的元素时，赋给一个变量，此时元素存在但不属于DOM节点树的一部分，成为一个文档碎片。利用appendChild方法插入到节点树中。

createTextNode方法：创建文本节点

在已有元素前插入一个新元素：insertBefore()方法

调用时需要申明新元素、目标元素和父元素，用法：parentElement.insertBefore(newElement,targetElement)

在已有元素后插入一个新元素：自创一个insertAfter方法

function insertAfter(newElement,targetElement) {
        var parent = targetElement.parentNode;
        if (parent.lastChild == targetElement) {
            parent.appendChild(newElement);
        }
        else
            parent.insertBefore(newElement,targetElement.nextSibling);
    }