懂jquery的同学来解释下，这是啥原因？

aliang 2016-09-04 04:56:29



<!DOCTYPE html>

<html>

<head>

<script type="text/javascript" src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script>

</head>

<body>

<div id="OrderList">

<table border="1">

<tr><td>1</td></tr>

</table>

<table border="1">

<tr><td>2</td></tr>

</table>

</div>

<script type="text/javascript">	

function getOrderData(html){

	var o=$(html);

	alert('这里为啥是：'+o.find('table').length+'，而不是2')

}

$(function(){

	getOrderData($('#OrderList').html());

})

</script>

</body>

</html>

不解，有人能说明原因吗？

...全文

127 9 打赏收藏转发到动态举报

写回复

用AI写文章

9 条回复

切换为时间正序

请发表友善的回复…

发表回复

aliang 2016-09-04

打赏
举报

明白了，我用o.filter('table')，谢谢二位同学

dmy_123 2016-09-04

打赏
举报

引用 6 楼 aliang888 的回复:

[quote=引用 1 楼 dmy_123 的回复:] find方法是寻找后代的，$('#OrderList').html()的后代并没有table元素，所以是0

还是来真实数据截图吧，应该更贴切点

o.find('.shippeditem').length o.find('p') 上面的为啥就正常 o.find('table') 为什么就它得到的是0 [/quote] 你先了解一下find()方法，我之前说的没错啊

天际的海浪 2016-09-04

打赏
举报

o这个jquery对象中本身包含的就是table元素， o.find('p')是获取o对象包含的table元素内的p，table元素内有p，这没问题而o.find('table')是获取o对象包含的table元素内的table，table元素内没有其它table，自然返回0个元素

aliang 2016-09-04

打赏
举报

引用 1 楼 dmy_123 的回复:

find方法是寻找后代的，$('#OrderList').html()的后代并没有table元素，所以是0

还是来真实数据截图吧，应该更贴切点

o.find('.shippeditem').length
o.find('p')
上面的为啥就正常
o.find('table') 为什么就它得到的是0

天际的海浪 2016-09-04

打赏
举报

引用 3 楼 aliang888 的回复:

[quote=引用 1 楼 dmy_123 的回复:] find方法是寻找后代的，$('#OrderList').html()的后代并没有table元素，所以是0


<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script type="text/javascript" src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script>
</head>
<body>
<div id="OrderList">
<table class="t">
  <tr>
    <td>1</td>
  </tr>
</table>
<table class="t">
  <tr>
    <td>2</td>
  </tr>
</table>
</div>
<script type="text/javascript">   
function getOrderData(html){
    var o=$(html);
	//这里为啥是：0，而不是2
    console.log(o.find('table').length);
	console.log($('table',o).length)
	console.log($('.t',o).length)
}
$(function(){
	//说明：这里其实是取一个编辑器里的html字符串，编辑器内容是从亚马逊后台复制过来的订单数据
	//我要提取出要的数据，然后保存在自己的后台，我这里为了方便测试，把【数据】放到div#OrderList里面
    getOrderData($('#OrderList').html());
})
</script>
</body>
</html>

[/quote]


function getOrderData(html){
	var o=$(html);//html字符串中只有两个<table>的代码，没有OrderList。
	alert(o.length)//o中是直接包含这两个新创建的<table>元素，直接取o.length ,不需要用.find('table')取子元素
}
$(function(){
	getOrderData($('#OrderList').html());
})

aliang 2016-09-04

打赏
举报

引用 2 楼 jslang 的回复:

getOrderData($('#OrderList'));

怪我没有把场景说明清楚，已说明了，你再看下

aliang 2016-09-04

打赏
举报

引用 1 楼 dmy_123 的回复:

find方法是寻找后代的，$('#OrderList').html()的后代并没有table元素，所以是0


<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script type="text/javascript" src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script>
</head>
<body>
<div id="OrderList">
<table class="t">
  <tr>
    <td>1</td>
  </tr>
</table>
<table class="t">
  <tr>
    <td>2</td>
  </tr>
</table>
</div>
<script type="text/javascript">   
function getOrderData(html){
    var o=$(html);
	//这里为啥是：0，而不是2
    console.log(o.find('table').length);
	console.log($('table',o).length)
	console.log($('.t',o).length)
}
$(function(){
	//说明：这里其实是取一个编辑器里的html字符串，编辑器内容是从亚马逊后台复制过来的订单数据
	//我要提取出要的数据，然后保存在自己的后台，我这里为了方便测试，把【数据】放到div#OrderList里面
    getOrderData($('#OrderList').html());
})
</script>
</body>
</html>

天际的海浪 2016-09-04