Basics-of-Querying-the-Dom

jquery api

http://api.jquery.com/

ul.emphasis li {}  //选择的是ul下面的li 不管是子节点还是孙子节点

ul.emphasis > li {}  //选择的只是子节点 孙子节点将不发生作用

下面的jquery代码只选择子节点，不选择孙子节点

<script type="text/javascript">
	$('ul.emphasis').children('li').css('color', 'red');
</script>

如果想查到所有孙子节点等，需要使用下面的方法：

<script type="text/javascript">
	$('ul.emphasis').find('li').css('color', 'red');
</script>

找到第一个子节点：

<script type="text/javascript">
	$('ul.emphasis').children('li:first-child').css('color', 'red');
</script>

第二个可以这么使用：

<script type="text/javascript">
	$('ul.emphasis').children('li:nth-child(2)').css('color', 'red');
</script>

jquery改变内容：

<script type="text/javascript">
	$('ul.emphasis').children('li:nth-child(2)').text('this is jquery created');
</script>

eq方法找到第一个元素：

<script type="text/javascript">
	$('ul.emphasis').children('li').eq(0).text('this is jquery created');
</script>

找到刚才元素的下一个：

<script type="text/javascript">
	$('ul.emphasis').children('li').eq(0).next().text('this is jquery created');
</script>

不过最好还是直接选中：

<script type="text/javascript">
	$('ul.emphasis li:nth-child(2)').text('this is jquery created');
</script>

也可以使用parent方法查找父节点，parent只上上面一层的父节点，如果想都找到那么需要使用parents

<script type="text/javascript">
	$('li').parents('div.container').removeClass('container');
</script>