对树进行选择和转换
选择
就想树一样,网站结构中叶存在子与父。在jQuery中,我们可以利用这一结构。假设我们拥有相同的html,但是现在我们想要选择名为“main”的div中的p元素,但是不想对任何有关p元素的东西造成变化。
我们有三种可能的方案,如下:
|
利用children方法可以选择树中位于其他元素下的某个元素。如果我们传递给它一个选择器,该方法将仅选择我们需要的元素,如果不是这样,父元素的所有子元素都将被选中。让我们看看第一个和第二个选择器直接的区别。
唯一的不同之处在于:第二个选择器中我们什么也没有指定,所有每一个子元素都会被选中。此处的关键在于:在上图中wrapper这个div元素下除main之外并没有其他子元素,所以我们得到的结果是一样的。
添加元素
现在我们在树中添加元素。这个元素可以是段落、div元素、表格等等,假设我们想要添加一个列表,如下:
|
只是一些字符串,所以我们可以在JavaScript代码中这样写:
|
现在我们要在html中某个地方添加字符串。比如,在之前我们选择的p元素之后。
最后我们可以输入完整的代码,如下所示:
|
字面上我们将字符串附加到HTML中的</p>,结果是这个列表显示在p元素之后。