jquery 添加与删除节点的几种方法

jquery 添加与删除节点的几种方法,第1张

append()、appendTo()

添加子元素(末尾)

prepend()

prependTo()

添加子元素(前置)

insertBefore()、before()

添加平级元素(前面)

insertAfter()

after()添加平级元素(后面)

replaceWith()和replaceAll()

用于替换某个节点

remove()

删除元素

empty()

删除子元素

一、attr():获取,添加,设置属性节点

1.当只有一个参数时为获取属性节点,无论找到多少个元素,都 只会返回第一个元素 的属性节点的值

2.当有两个参数时为 添加 或 设置 属性节点的值

(1).如果设置的属性不存在,则为 所有找到的元素 添加新属性节点

(2).如果设置的属性存在,则为 所有找到的元素 设置属性节点

二、removeAttr(): 删除 所有找到的属性节点

二、 *** 作多个属性节点时

1.attr():使用对象的形式

2.同时删除多个属性节点, 添加空格 即可

本文实例讲述了jQuery删除节点的方法。分享给大家供大家参考,具体如下:

<html>

<head>

<meta

http-equiv="Content-Type"

content="text/html

charset=utf-8"

/>

<title></title>

<script

src="js/jquery-1.10.1.min.js"

type="text/javascript"></script>

<script

type="text/javascript">

//<![CDATA[

$(function(){

//第一种删除的方法

$("ul

li:eq(1)").remove()

//

获取第二个<li>元素节点后,将它从网页中删除。

//第二种删除的方法

var

$li

=

$("ul

li:eq(1)").remove()

//

获取第二个<li>元素节点后,将它从网页中删除。

$li.appendTo("ul")

//

把刚才删除的又重新添加到<ul>元素里

//所以,删除只是从网页中删除,在jQuery对象中,这个元素还是存在的,我们可以重新获取它

//第三种删除的方法

$("ul

li").remove("li[title!=菠萝]")

//把<li>元素中属性title不等于"菠萝"的<li>元素删除

//第四种删除的方法

$("ul

li:eq(1)").empty()

//

获取第二个<li>元素节点后,清空此元素里的内容

})

//]]>

</script>

</head>

<body>

<p

title="选择你最喜欢的水果."

>你最喜欢的水果是?</p>

<ul>

<li

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

<li

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

<li

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

</ul>

</body>

</html>

效果图如下:

更多关于jQuery相关内容感兴趣的读者可查看本站专题:《jQuery常见事件用法与技巧总结》、《jQuery常用插件及用法总结》、《jQuery *** 作json数据技巧汇总》、《jQuery扩展技巧总结》、《jQuery拖拽特效与技巧总结》、《jQuery表格(table) *** 作技巧汇总》、《jQuery常见经典特效汇总》、《jQuery动画与特效用法总结》及《jquery选择器用法总结》

希望本文所述对大家jQuery程序设计有所帮助。


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/bake/11647199.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-17
下一篇 2023-05-17

发表评论

登录后才能评论

评论列表(0条)

保存