從右至左選擇：五大迭代器

如果是從左至右，我們想過濾一些節點，就用現在手頭上的節點就行了，但從右至左，我們就需要根據這些節點的父親、孩子、兄弟進行過濾，而且過濾後，這些用作比較的節點不能丟棄掉,它們可以還要用於下一次的過濾。這樣就存在一個代理關係，我們需要一些代理器來幹這事情。當然像div.aaa是不需要代理器，但div div.aaa就需要了。在從左至右的情況下，我們所有說的關係選取器，主要有親子兄長與相鄰三種，遇到後代選取器，我們可以轉化為萬用字元選取器與標籤選取器。而在從右至左，關係選取器就包括後代萬用字元親子兄長相鄰五種，萬用字元實質是一種帶層次關係的後代選取器。

    //取得候選集的共同父節點的合集    var getParent = function(testee,result,yess,pid){        while((testee = testee.parentNode)){            pid = testee.uniqueID || (testee.uniqueID = dom.UID++);            if(yess[pid]){                result = testee            }        }        return result;    }     var iterators = {        current:function(nextset){            var set = this, nodes = this.nodes,tagName = this.tagName, filter = this.filter,args = this.args,            result = [], testee, uid;            for(var i = 0,ri = 0, node;node = nodes[i++];){                uid = node.uniqueID || (node.uniqueID = dom.UID++);                testee = set[uid] || node;                if((!tagName || tagName === testee.nodeName) && (!filter || filter.apply(testee,args))){                    result[ri++] = node;                    nextset[uid] = testee;                }            }            nextset.nodes = result;        },        parent:function(nextset){            var set = this, nodes = this.nodes,tagName = this.tagName, filter = this.filter,args = this.args,            result = [], yess = {}, testee, uid, pid;            for(var i = 0,ri = 0, node; node = nodes[i++];){                uid =  node.uniqueID || (node.uniqueID = dom.UID++);                testee = set[uid] || node;                while((testee = testee.parentNode)  && testee.nodeType === 1 ){                    pid = testee.uniqueID || (testee.uniqueID = dom.UID++);                    if(yess[pid]){                        result[ri++] = node;                        nextset[uid] = testee;                        break;                    }                    if((!tagName || tagName === testee.nodeName) && (!filter || filter.apply(testee,args))){                        yess[pid] = result[ri++] = node;                        nextset[uid] = testee;                    }                    break;                }            }            nextset.nodes = result;        },    iterators.parents = function (nextset) {        var set = this, nodes = this.nodes, tagName = this.tagName, filter = this.filter, args = this.args, level = this.level, _level, result = [], testee, uid, pid, yess = {};        for (var i = 0, ri = 0, node; node = nodes[i++];) {            uid = node.uniqueID || (node.uniqueID = dom.UID++);            testee = set[uid] || node;            while ((testee = testee.parentNode)) {                if (testee.nodeType === 1) {                    if (level) {                        _level = level;                        while (_level-- && (testee = testee.parentNode)) {                        }                        if (!testee) {                            break;                        }                    }                    pid = testee.uniqueID || (testee.uniqueID = dom.UID++);                    if (yess[pid]) {                        result[ri++] = node;                        nextset[uid] =  nextset[yess[pid].uniqueID];                        break;                    }                    if ((!tagName || tagName === testee.nodeName) &&                        (!filter || filter.apply(testee, args))) {                        yess[pid] = result[ri++] = node;                        nextset[uid] = getParent(testee, result, yess, pid);                        break;                    }                }            }        }        nextset.nodes = result;    }        border:function(nextset){            var set = this, nodes = this.nodes,tagName = this.tagName, filter = this.filter,args = this.args,            result = [], testee, uid;            for(var i = 0,ri = 0, node;node = nodes[i++];){                uid = node.uniqueID || (node.uniqueID = dom.UID++);                testee = set[uid] || node;                while((testee = testee.previousSibling) && testee.nodeType === 1){                    if((!tagName || tagName === testee.nodeName) && (!filter || filter.apply(testee,args))){                        result[ri++] = node;                        nextset[uid] =  testee;                    }                    break;                }            }            nextset.nodes = result;        },        borders:function(nextset){            var set = this, nodes = this.nodes,tagName = this.tagName, filter = this.filter,args = this.args,            result = [], yess = {}, testee, uid, pid;            for(var i = 0,ri = 0, node;node = nodes[i++];){                uid = node.uniqueID || (node.uniqueID = dom.UID++);                testee = set[uid] || node;                while((testee = testee.previousSibling) && testee.nodeType === 1){                    pid = testee.uniqueID || (testee.uniqueID = dom.UID++);                    if(yess[pid]){                        result[ri++] = node;                        nextset[uid] = testee                        break;                    }                    if((!tagName || tagName === testee.nodeName) && (!filter || filter.apply(testee,args))){                        yess[pid] = result[ri++] = node;                        nextset[uid] = testee;                        break;                    }                }            }            nextset.nodes = result;        }    }

它們幾個好相似，正在考慮是否動態產生它們……

<br /><!doctype html><br /><html><br /> <head><br /> <title>從右至左選擇:測試樣式（針對關係選取器） </title><br /> <meta http-equiv="X-UA-Compatible" content="IE=8" /><br /> <script src="dom/lib/queryv41.js"></script><br /> <style><br /> span ~span~span{<br /> color: red;<br /> }<br /> </style></p><p> <script><br /> window.onload = function(){<br /> var show = function(sets){<br /> var array = []<br /> for(var i in sets){<br /> array.push(sets[i].innerHTML)<br /> }<br /> alert(array)<br /> }<br /> //"tr~tr~tr"<br /> //div span~ span<br /> //div+div span<br /> //tr+tr+tr<br /> // var els = dom.query("span~span~span");<br /> // alert(els.length)<br /> // show(els)<br /> }<br /> </script></p><p> </head><br /> <body></p><p> <table class="filament_table" cellspacing="0" width="700" rules="cols" border="1"><br /> <col class="grey" width="30%"></col><br /> <col class="yellow"></col><br /> <thead><br /> <tr><br /> <th>property</th><br /> <th>value</th><br /> </tr><br /> </thead><br /> <tbody><br /> <tr><br /> <td>display</td><br /> <td>inline-block</td><br /> </tr><br /> <tr><br /> <td>height</td><br /> <td>any value</td><br /> </tr><br /> <tr><br /> <td>float</td><br /> <td>left or right</td><br /> </tr><br /> <tr><br /> <td>position</td><br /> <td>absolute</td><br /> </tr><br /> <tr><br /> <td>width</td><br /> <td>any value</td><br /> </tr><br /> <tr><br /> <td>writing-mode</td><br /> <td>tb-rl</td><br /> </tr><br /> <tr><br /> <td>zoom</td><br /> <td>any value</td><br /> </tr><br /> </tbody><br /> </table><br /> <div id="parent1" class="ccc bbb"><br /> <span>11111111</span><br /> </div></p><p> <div><br /> <span>54354435</span><br /> <div id="parent2"><br /> <span class="aaa bbb">aaaaaaaaa</span><br /> <span>bbbbbbb</span><br /> <strong>ccccccc</strong><br /> <span>dddddddd</span><br /> <div><br /> <span>44444444</span><br /> </div><br /> </div><br /> </div><br /> <span id="prev">555555555</span></p><p> </body><br /></html></p><p>

運行代碼

用時間截代替UID的篩選功能

選擇div div div

    3                                                            3                                        

後代

var fathers = function () {    var querytime = dom.querytime //new Date - 0    var nodes = this[0],set = this[1],args = this[4], filter = this[5],_set = [], _nodes = [], i = 0, ri = 0,node, testee;    while ((testee = set[i])) {        node = testee; //node至始自終從候選集中甄選,testee則從set的元素的長輩裡甄選        while ((testee = testee.parentNode)) {            if (testee.querytime === querytime) {                _set[ri] = testee;                _nodes[ri++] = nodes[i];                break;            }            if (testee.nodeName === "DIV") {                testee.querytime = querytime                _set[ri] = testee;                _nodes[ri++] = nodes[i];                break;            }        }        i++;    }    this[0] = _nodes;    this[1] = _set;    this.length = 3;}

親子

var father = function () {    var querytime = dom.querytime;    var nodes = this[0], set = this[1], args = this[4], filter = this[5], _set = [], _nodes = [], i = 0, ri = 0, node, testee;    while ((testee = set[i])) {        node = testee;        while ((testee = testee.parentNode)) {            if (testee.querytime === querytime) {                _set[ri] = testee;                _nodes[ri++] = node;                break;            }            if (testee.nodeName === "DIV") {                testee.querytime = querytime                _set[ri] = testee;                _nodes[ri++] = node;            }            break;        }        i++;    }    this[0] = _nodes;    this[1] = _set;    this.length = 3;}

2011.1.26

var border = function (expr, set, flag_xml) {    var selector, filter = Rage.filter;    expr = expr.replace(reg_tag, function ($) {        selector = $ === '*' ? true : flag_xm ? $ : $.toUpperCase();        return '';    });    for (var i = 0, n = set.length; i 
var parent = function (expr, set, flag_xml) {    var selector, filter = Rage.filter;    expr = expr.replace(reg_tag, function ($) {        selector = $ === '*' ? true : flag_xm ? $ : $.toUpperCase();        return '';    });    for (var i = 0, n = set.length; i 
var borders = function (expr, set, flag_xml) {    var selector, filter = Rage.filter,_filter = Rage._filter,flag_fn = false,old = expr,prop = 'previousSibling';    expr = expr.replace(reg_first, function ($) {        if (reg_tag.test($)) {            selector = $ === '*' ? true : flag_xm ? $ : $.toUpperCase();        } else {            selector = $;            flag_fn = true;        }        return '';    });    if (expr === old) {        throw old + '存在語法錯誤';    }    _filter.call(null, selector, set, prop, flag_fn);    expr && filter.call(null, expr, set, true);}
var parents = function (expr, set, flag_xml) {    var selector, filter = Rage.filter,_filter = Rage._filter, flag_fn = false,old = expr, prop = 'parentNode';    expr = expr.replace(reg_first, function ($) {        if (reg_tag.test($)) {            selector = $ === '*' ? true : flag_xm ? $ : $.toUpperCase();        } else {            selector = $;            flag_fn = true;        }        return '';    });    if (expr === old) {        throw old + '存在語法錯誤';    }    _filter.call(null, selector, set, prop, flag_fn);    expr && filter.call(null, expr, set, true);}