jQuery中的DOM操作

来源:互联网 发布:unity3d ngui 实例 编辑:程序博客网 时间:2024/06/05 11:44


<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>元素节点属性titlealert(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);













原创粉丝点击