xiyueta().add() 属性方法

创建一个新的 xiyueta 对象，将元素添加到匹配的元素集中

快速上手

xiyueta().add()属性方法，一种调用方式：
1、xiyueta("p").add("div"); //创建一个新的 xiyueta 对象，将元素添加到匹配的元素集中

总结：xiyueta().add()用法与jQuery中jQuery().add()用法保持一致,xiyueta().add()方法如果参数值是数字类型如123，布尔如true或函数在jQuery里会加上这个数字或布尔或documen，在xiyueta里不会在数组里加上数字或布尔的，因为没有意义，在处理的时候也不能处理。
see https://api.jquery.com/add
尝试一下>>

代码
效果

<script src="https://www.xiyueta.com/js/xiyueta.min.js"></script>
<script>var html = '<div>xiyueta.com</div><span></span>';
$.load(html);
$.log($("div").add("span").length);
$.log($("div").add("div").length);
$.log($("div").add($("div")).length);
$.log($("div").add(1).length);

// $.log($("div").parse("<span></span><span></span><span></span>").add("span").length);//解析html后获得元素文本  简单快速方法
</script>

例子1：
查找所有div并制作边框。然后将所有段落添加到xiyueta对象以将其背景设置为黄色。（引用jQuery例子）
查看效果>>

代码

<script src="https://www.xiyueta.com/js/xiyueta.min.js"></script>
<script>
var html = [
    '<style>',
    '  div {',
    '    width: 60px;',
    '    height: 60px;',
    '    margin: 10px;',
    '    float: left;',
    '  }',
    '  p {',
    '    clear: left;',
    '    font-weight: bold;',
    '    font-size: 16px;',
    '    color: blue;',
    '    margin: 0 10px;',
    '    padding: 2px;',
    '  }',
    '  </style> ',
    '',
    '<div></div>',
    '<div></div>',
    '<div></div>',
    '<div></div>',
    '<div></div>',
    '<div></div>',
    ' ',
    '<p>Added this... (notice no border)</p>'
].join("\n");

xiyueta.load(html); 


$( "div" ).css( "border", "2px solid red" )
  .add( "p" )
  .css( "background", "yellow" );
 
 
$.log(xiyueta.html())  
document.write(xiyueta.html())
</script>

例子2：
将给定表达式匹配的更多元素添加到匹配元素集。（引用jQuery例子）
查看效果>>

代码

<script src="https://www.xiyueta.com/js/xiyueta.min.js"></script>
<script>
var html = [
    '<p>Hello</p>',
    '<span>Hello Again</span>'
].join("\n");

xiyueta.load(html);


$("p").add("span").css("background", "yellow");



$.log(xiyueta.html())
document.write(xiyueta.html())
</script>

详细说明

详细演示jquery().add()的.add()属性方法与xiyueta().add()的.add()属性方法的效果。
通过给.add()传不同类型的值来测试.add()属性在jquery里和xiyueta里的效果是否一样。
传值类型有字符，数字，数组，对象，函数等。
查看效果>>

代码

 
<script src="https://www.xiyueta.com/js/xiyueta.min.js"></script>
<script src="https://www.xiyueta.com/js/jquery.js"></script>

    <ul>
        <li>xiyueta.com</li> 
    </ul>
    <script type="text/javascript">  
    var c ="";
    var id=0;//编号
    var fun=function(n){
        if(n==undefined)n=1;
        return n;
    }    
    var funtrue=function(){
        return true;
    }    
    var funfalse=function(){
        return false;
    }
    var funstr=function(){
        return "str";
    }
    var funnumb=function(){
        return 123;
    }
    var funarray=function(){
        return [1,2,"a",false,true];
    }
    var funobj=function(){
        return {"a":"11","bb":"22","ccc":"333"};
    }

    xiyueta.load("xiyueta.com")

    jQueryAndxiyuetaDebug('jQuery("li:eq(0)").add(jQuery("li:eq(0)")).length');
    jQueryAndxiyuetaDebug('jQuery("li:eq(0)").add().length');
    jQueryAndxiyuetaDebug('jQuery("li:eq(0)").add("").length');
    jQueryAndxiyuetaDebug('jQuery("li:eq(0)").add(" ul ").length');
    jQueryAndxiyuetaDebug('jQuery("li:eq(0)").add("ul").length');
    jQueryAndxiyuetaDebug('jQuery("li:eq(0)").add(1).length');
    jQueryAndxiyuetaDebug('jQuery("li:eq(0)").add(123).length');
    jQueryAndxiyuetaDebug('jQuery("li:eq(0)").add(313801120).length');
    jQueryAndxiyuetaDebug('jQuery("li:eq(0)").add(null).length'); 
    jQueryAndxiyuetaDebug('jQuery("li:eq(0)").add(undefined).length'); 
    jQueryAndxiyuetaDebug('jQuery("li:eq(0)").add(fun()).length');
    jQueryAndxiyuetaDebug('jQuery("li:eq(0)").add("a").length');
    jQueryAndxiyuetaDebug('jQuery("li:eq(0)").add(false).length');
    jQueryAndxiyuetaDebug('jQuery("li:eq(0)").add(true).length');
    jQueryAndxiyuetaDebug('jQuery("li:eq(0)").add(1.1).length');
    jQueryAndxiyuetaDebug('jQuery("li:eq(0)").add([1,2,3,4,5,6]).length');
    jQueryAndxiyuetaDebug('jQuery("li:eq(0)").add({"a":1,"b":2,"c":3}).length');
    jQueryAndxiyuetaDebug('jQuery("li:eq(0)").add(NaN).length');
    jQueryAndxiyuetaDebug('jQuery("li:eq(0)").add(Infinity ).length');
    jQueryAndxiyuetaDebug('jQuery("li:eq(0)").add(function(){}).length');


    jQueryAndxiyuetaDebug('jQuery("li:eq(0)").add(funtrue()).length');
    jQueryAndxiyuetaDebug('jQuery("li:eq(0)").add(funfalse()).length');
    jQueryAndxiyuetaDebug('jQuery("li:eq(0)").add(funstr()).length');
    jQueryAndxiyuetaDebug('jQuery("li:eq(0)").add(funnumb()).length');
    jQueryAndxiyuetaDebug('jQuery("li:eq(0)").add(funarray()).length');
    jQueryAndxiyuetaDebug('jQuery("li:eq(0)").add(funobj()).length');


    jQueryAndxiyuetaDebug('jQuery("li:eq(0)").add([]).length');
    jQueryAndxiyuetaDebug('jQuery("li:eq(0)").add({}).length'); 
    jQueryAndxiyuetaDebug('jQuery("li:eq(0)").add( 100n ).length');//在asp版不行
 

    function jQueryAndxiyuetaDebug(js) {
        var jsXiyueta=js.replace(/jQuery/g,"xiyueta")
        var s1=jsEv(js)
        var s2=jsEv(jsXiyueta)
        id++
        xiyueta.log(id,js,s1,jsXiyueta,s2,(s1==s2))
        console.log(id,js,s1,jsXiyueta,s2,(s1==s2))
    }
    function jsEv(js) {
        var s = eval(js);
        var deyu = "";
        if (typeof s == 'string') {
            s = s.replace(/\n/g, '\\n');
            deyu = "'" + s + "'";
        } else if (typeof s == "object") {
            deyu = "'" + s + "'";
        }else{
            deyu=s+""
        }
        if(deyu=="")deyu="''"; 
        return deyu; 
    }

</script>