jQuery中的DOM操作

<p title="选择你最喜欢的水果"> 你最喜欢的水果是？ </p>

<ul>

<li title='苹果'>苹果</li>

<li title='橘子'>橘子</li>

<li title='菠萝'>菠萝</li>

</ul>

查找节点

1: 查找元素节点

var $li = $("ul li:eq(1)"); //获取<ul>里第2个<li>节点
var li_txt = $li.text();  //获取第2个<li>元素节点的文本内容
alert(li_txt);

以上代码获取了<ul>元素里第2个<li>节点，并将它的文本内容“橘子”打印出来

2:查找属性节点

利用jQuery选择器查找到需要的元素之后，就可以使用attr()方法来获取它的各种属性的值。attr()方法的参数可以使一个，也可以是两个。当参数是一个的时，则是要查询的属性的名字，例如：

获取属性节点并打印它的文本内容，jQuery代码如下：

var $para = $("p");  //获取<p>节点
var p_text = $para.attr("title"); //获取<p>元素节点属性title
alert(p_text); //打印title属性值

以上代码获取了<p>节点，并将它的title属性的值打印出来。

3: 创建节点

$(html)方法会根据传入的HTML编辑字符串，创建一个DOM对象，并将这个DOM对象包装成一个jQuery对象后返回。

首先创建两个<li>元素，jQuery代码如下：

var $li_1  = $("<li></li>");
var $li_2  = $("<li></li>");


$("ul").append($li_1);
$("ul").append($li_2);


//可以采取链式写法：$("ul").append($li_1).append($li_2);