js权威指南笔记

        //如setTimeout的delay参数为0毫秒，那么指定的函数不会立即执行。只会把它放到队列中，等到前面处于等待状态的事件处理
        //程序全部执行完成后，再调用它。
        function invoke(f, start, interval, end) {
            if (!start) start = 0;
            if (arguments.length <= 2) {
                setTimeout(f, start);
            }
            else {
                setTimeout(repeat, start);
                function repeat() {
                    var h = setInterval(f, interval);
                    if (end) {
                        setTimeout(function () {
                            clearInterval(h);
                        }, end);
                    }
                }
            }
        }
        function urlArg() {
            var args = {};
            var query = location.search.substring(1);
            var pairs = query.split('&');
            for (var i = 0; i < pairs.length; i++) {
                var pos = pairs[i].indexOf('=');
                if (pos == -1) continue;
                var name = pairs[i].substring(0, pos);
                var value = pairs[i].substring(pos + 1);
                value = decodeURIComponent(value);
                args[name] = value;
            }
            return args;
        }

        //location.search = '?page=' + (pagenum + 1);//载入下一个页面
        //showModalDialog("arrayTest.html");

        //每一个window对象都有一个frames属性，它引用自身包含的窗口或窗体的子窗体。可通过数字或窗体名称进行索引。名称是指iframe的name或id属性。
        //frames数组里的元素师window对象而不是<iframe>元素
        //frames['f1']
        //alert(window.frames.length)

        //nodeType : 9 代表document节点，1代表element节点,3代表text节点，8代表comment节点，11代表documentFragment节点。
        //nodeValue : text节点或comment节点的文本内容。
        //element对象的children属性列表只包含element对象。
        //text节点，comment节点没有children属性，意味着node.parentNode属性不可能返回text节点或comment节点，总是返回另一个element
        //var attr1 = document.getElementById("sele_file").getAttribute("type");
        //getAttribute返回的都是字符串，不返回数值、布尔值或对象
        //var attr1 = document.getElementById("sele_file").removeAttribute("disabled");//delete disabled 使其可用
        //document.getElementById("sele_file").attributes["type"]
        //

        function textContent(element, value) {
            var content = element.textContent;//firefox
            if (value === undefined) {
                if (content) return content;
                else return element.innerText;//ie or other
            }
            else {
                if (content) element.textContent = value;
                else element.innerText = value;
            }
        }
        //查找元素的后代中节点的所有text节点
        function textContentEle(e) {
            var child, type, s = "";
            for (child = e.firstChild; child != null; child = child.nextSibling) {
                type = child.nodeType;
                if (type === 3 || type === 4)//text,CDATASection节点
                    s += child.nodeValue;
                else if (type === 1)
                    s += textContentEle(child);
            }
            return s;
        }

function loadasyuc(url) {
            var head = document.getElementsByTagName("head")[0];
            var s = document.createElement("script");
            s.src = url;
            head.appendChid(s);
        }

//表格行的排序
        function sortRows(table, n, compartor) {
            var tbody = table.tBodies[0];
            var rows = tbody.getElementsByTagName("tr");
            rows = Array.prototype.slice.call(rows, 0);
            rows.sort(function (row1, row2) {
                var cell1 = row1.getElementsByTagName("td")[n];
                var cell2 = row2.getElementsByTagName("td")[n];
                var val1 = cell1.innerText || cell1.textContent;
                var val2 = cell2.innerText || cell2.textContent;
                if (compartor) return compartor(val1, val2);
                if (val1 < val2) return -1;
                else if (val1 > val2) return 1;
                else return 0;
            });
            //如果调用appendChid在已存在的文档中的一个节点再次插入，那个节点自动从它当前的位置删除并在新的位置重新插入
            //所有下面的就没必要显示的删除节点。
            for (var i = 0; i < rows.length; i++) {
                tbody.appendChid(rows[i]);
            }
        }
        function makeSortable(table) {
            var heads = table.getElementsByTagName("th");
            for (var i = 0; i < heads.length; i++) {
                (function (n) {
                    heads[i].onclick = function () { sortRows(table, n); };
                } (i))
            }
        }

 //n.parentNode.removeChild(n);//delete n
        //倒序排列节点n的子节点
        function reverseNodeChild(n) {
            var f = document.createDocumentFragment();
            while (n.lastChid)//给f添加一个节点，该节点自动地会从n中删除
                f.appendChild(n.lastChild);
            n.appendChild(f);
        }

//left,top表示元素的左上角的x和y坐标，right和bottom属性表示元素的右下角的x和y坐标
        //可计算元素的width,height.该方法，在用户滚动或改变浏览器窗口大小时不会更新他们。
        var box = document.getElementById("sele_file").getBoundingClientRect();
        var boxWid = box.width || (box.right - box.left);
        var boxHei = box.height || (box.bottom - box.top);
        //alert(boxHei);
        //alert(dd.left);

        //计算e元素的位置要有一个循环
        function getElementPos(e) {
            var x = 0, y = 0;
            while (!e) {
                y += e.offsetLeft;
                x += e.offsetTop;
                e = e.offersetParent;
            }
            return { x: x, y: y };
        }
        //元素(div)的width和height只指定了元素内容区域的尺寸，它不包含元素的内边距或边框(或外边距)所需的任何额外空间。
        //为了确定有边框元素在屏幕上的全尺寸，必须把元素的宽度加上左右两边的内边距和左右两个边框宽度，高度也一样。

 //classlist
        function classList(e) {
            if (e.classList) return e.classList;
            return new CSSClassList(e);
        }
        function CSSClassList(e) {
            this.e = e;
        }
        CSSClassList.prototype.contains = function (c) {
            if (c.length === 0 || c.indexOf(' ') != -1)
                throw "invalid class name:" + c;
            var cla = this.e.className;
            if (!cla) return false;
            if (cla === c) return true;

            return cla.search("\b" + c + "\b") != -1;
        }
        CSSClassList.prototype.add = function (c) {
            if (this.contains(c)) return;
            var cla = this.e.className;
            if (cla && cla[cla.length - 1] != " ")
                c = " " + c;
            this.e.className += c;
        }
        CSSClassList.prototype.remove = function (c) {
            if (c.length === 0 || c.indexOf(' ') != -1)
                throw "invalid class name:" + c;
            var pattern = new RegExp("\b" + c + "\b\s*", "g");
            this.e.className.replace(pattern, "");
        }
        CSSClassList.prototype.toString = function () {
            return this.e.className;
        }

        CSSClassList.prototype.toArray = function () {
            return this.e.className.match(/w+/g) || [];
        }

/*
        字符串var str = '1,222,33,55,44'.是否包含字符串var cstr='22'
        */
        function commaStringContainsStr(str,cstr) {
            if (cstr.length === 0 || cstr.indexOf(',') != -1)
                throw "invalid name:" + cstr;
            if (!str) return false;
            if (str === cstr) return true;

            var pattern = new RegExp("(\b|,)" + cstr + "(\b|,)", "g");
            return str.search(pattern) != -1;
        }
        
        //add
        function commaStringAddStr(str, cstr) {
            if (commaStringContainsStr(str, cstr)) return;
            if (str && str[str.length - 1] != ",")
                cstr = "," + cstr;
            return str + cstr;
        }
        //remove
        function commaStringRemoveStr(str, cstr) {
            if (cstr.length === 0 || cstr.indexOf(',') != -1)
                throw "invalid name:" + cstr;

            var pattern = new RegExp("\b" + cstr + "\b,*", "g");
            str = str.replace(pattern, "");
            if (str && str[str.length - 1] == ",") {
                str = str.substring(0, str.length - 1);
            }
            return str;
        }
        var str1 = '1,222,33,55,44';
        var cstr1 = '2';
        try {
            alert(commaStringRemoveStr(str1, cstr1));
        }
        catch (e) {
            alert(e)
        }

    <script id="txt_script" type="text/x-custom-data">
    <html><div>sssss</div>
    </script>

        // alert(document.getElementById("txt_script").text);
        var Insert = (function () {
            if (document.createElement("div").insertAdjacentHTML) {
                return {
                    before: function (e, h) { e.insertAdjacentHTML("beforebegin", h); },
                    after: function (e, h) { e.insertAdjacentHTML("afterend", h); },
                    atStart: function (e, h) { e.insertAdjacentHTML("afterbegin", h); },
                    atEnd: function (e, h) { e.insertAdjacentHTML("beforeend", h); }
                };
            }
            function fragment(html) {
                var elt = document.createElement("div");
                var flag = document.createDocumentFragment();
                elt.innerHTML = html;
                while (elt.firstChild)
                    flag.appendChild(elt.firstChild);
                return flag;
            }
            var Insert = {
                before: function (elt, html) {
                    elt.parentNode.insertBefore(fragment(html), elt);
                },
                after: function (elt, html) {
                    elt.parentNode.insertBefore(fragment(html), elt.nextSibling);
                },
                atStart: function (elt, html) {
                    elt.insertBefore(fragment(html), elt.firstChild);
                },
                atEnd: function (elt, html) {
                    elt.appendChild(fragment(html));
                }
            };
            Eelement.property.insertAdjacentHTML = function (pos, html) {
                switch (pos) {
                    case "before":
                        return Insert.before(this, html);
                        break;
                    case "after":
                        return Insert.after(this, html);
                        break;
                    case "atStart":
                        return Insert.atStart(this, html);
                        break;
                    case "atEnd":
                        return Insert.atEnd(this, html);
                        break;
                }
            };
            return Insert;
        } ());