获取当前匹配元素集合中每个元素的后代
xiyueta().find()属性方法,有一种调用方式:
1、xiyueta("div").find("span"); //获取当前匹配元素集合中每个元素的后代
总结:xiyueta().find()用法与jQuery中jQuery().find()用法保持一致
see https://api.jquery.com/find
尝试一下>>
<script src="https://www.xiyueta.com/js/xiyueta.min.js"></script> <script>
var html = "<div> <ul> <li>xiyueta库</li> <li>xiyueta.com</li> </ul> </div>"; $.load(html); $.log($("div").find("li").length); // $.log($("div").parse(html).find("li").length); //解析html后获得元素长度 简单快速方法
</script>
2
例子1:
以所有段落开头并搜索后代span元素,与 $( "p span" )相同。(引用jQuery例子)
查看效果>>
<script src="https://www.xiyueta.com/js/xiyueta.min.js"></script> <script>
var html = [ '<p><span>Hello</span>, how are you?</p>', "<p>Me? I'm <span>good</span>.</p>" ].join("\n"); $.load(html) document.write($.html()) $( "p" ).find( "span" ).css( "color", "red" ); $.log($.html()) document.write($.html())
</script>
例子2:
使用所有span标记的xiyueta集合进行选择。只有p标记内的跨度更改为红色,而其他跨度保留为蓝色。(引用jQuery例子)
查看效果>>
<script src="https://www.xiyueta.com/js/xiyueta.min.js"></script> <script>
var html = [ ' <style>', ' p {', ' font-size: 20px;', ' width: 200px;', ' color: blue;', ' font-weight: bold;', ' margin: 0 10px;', ' }', ' .hilite {', ' background: yellow;', ' }', ' </style>', '<p>', ' When the day is short', ' find that which matters to you', ' or stop believing', '</p>' ].join("\n"); xiyueta.load(html); var newText = $("p").text().split(" ").join("</span> <span>"); newText = "<span>" + newText + "</span>"; $("p").html(newText); xiyueta.load(xiyueta.html()); //重新解析html $("p").find("span").odd().addClass("hilite"); $.log(xiyueta.html()) document.write(xiyueta.html())
</script>
详细演示jquery().find()的.find()属性方法与xiyueta().find()的.find()属性方法的效果。
通过给.find()传不同类型的值来测试.find()属性在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("<ul><li>xiyueta.com</li></ul>")
jQueryAndxiyuetaDebug('jQuery("ul").find().length');
jQueryAndxiyuetaDebug('jQuery("ul").find("").length');
jQueryAndxiyuetaDebug('jQuery("ul").find("li").length');
jQueryAndxiyuetaDebug('jQuery("ul").find(1).length');
jQueryAndxiyuetaDebug('jQuery("ul").find(123).length');
jQueryAndxiyuetaDebug('jQuery("ul").find(313801120).length');
jQueryAndxiyuetaDebug('jQuery("ul").find(null).length');
jQueryAndxiyuetaDebug('jQuery("ul").find(undefined).length');
jQueryAndxiyuetaDebug('jQuery("ul").find(fun()).length');
jQueryAndxiyuetaDebug('jQuery("ul").find("a").length');
jQueryAndxiyuetaDebug('jQuery("ul").find(false).length');
jQueryAndxiyuetaDebug('jQuery("ul").find(true).length');
jQueryAndxiyuetaDebug('jQuery("ul").find(1.1).length');
jQueryAndxiyuetaDebug('jQuery("ul").find([1,2,3,4,5,6]).length');
jQueryAndxiyuetaDebug('jQuery("ul").find({"a":1,"b":2,"c":3}).length');
jQueryAndxiyuetaDebug('jQuery("ul").find(NaN).length');
jQueryAndxiyuetaDebug('jQuery("ul").find(Infinity ).length');
jQueryAndxiyuetaDebug('jQuery("ul").find(function(){}).length');
jQueryAndxiyuetaDebug('jQuery("ul").find(funtrue()).length');
jQueryAndxiyuetaDebug('jQuery("ul").find(funfalse()).length');
jQueryAndxiyuetaDebug('jQuery("ul").find(funstr()).length');
jQueryAndxiyuetaDebug('jQuery("ul").find(funnumb()).length');
jQueryAndxiyuetaDebug('jQuery("ul").find(funarray()).length');
jQueryAndxiyuetaDebug('jQuery("ul").find(funobj()).length');
jQueryAndxiyuetaDebug('jQuery("ul").find([]).length');
jQueryAndxiyuetaDebug('jQuery("ul").find({}).length');
// jQueryAndxiyuetaDebug(' $("ul").find( 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>