jQuery -> 删除/替换DOM元素

删除

删除操作非常简单,直接在结果集后链式调用remove()方法即可。

例如,要删除以下html脚本中所有的a元素,直接通过

$(‘a‘.remove();

就可以做到了。

	<h3>Anchors</h3>
	<a href="#" class="remove">Anchor Element</a>
	<a href="#">Anchor Element</a>
	<a href="#" class="remove">Anchor Element</a>

当然也可以通过向remove传参的形式来过滤选择结果,然后再执行remove操作。

$(‘a‘).remove(‘.remove‘);

需要注意的是

  1. remove操作并不会把符合条件的元素从结果集中删除,所以理论上可以继续操作被"删除"掉的元素
  2. remove操作不但会“删除”元素与所有元素相关的数据也会被删除(event handlers、internally cached data)

替换

如果想要把classremoveli元素替换为<li>removed</li>,可以使用以下两种等价的方法

  1. $(‘li.remove‘).replaceWith(‘<li>removed</li>);
  2. $(‘<li>removed</li>;).replaceAll(‘li.remove‘);

jQuery -> 删除/替换DOM元素,布布扣,bubuko.com

时间: 2024-12-08 18:24:22

jQuery -> 删除/替换DOM元素的相关文章

[ jquery 方法 get(index) ] 可以将取得的相应jquery对象和DOM元素对象进行转化

取得其中一个匹配的元素:index表示取得第几个匹配的元素,这能够让你选择一个实际的DOM 元素并且对他直接操作,而不是通过 jQuery 函数.$(this).get(0)与$(this)[0]等价, 这段话的意思就是可以将jquery对象和DOM元素对象进行转化 实例: <!DOCTYPE html> <html lang='zh-cn'> <head> <title>Insert you title</title> <meta htt

jquery删除指定li元素简单介绍

jquery删除指定li元素简单介绍:本章节介绍一下如何利用jquery删除指定的li元素,虽然比较简单,但这也是比较常见的操作,可能很多初学者还是不够了解,下面就通过代码实例介绍一下如何实现此功能,代码如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.sof

jQuery操作得到DOM元素

jQuery再DOM操作方面提供了一些函数及其用法,这里就对DOM元素的包装简单说明一下,怎样使用会了,对其它方法也能灵活的使用.以下是一个小样例及其效果图. 代码例如以下: <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <meta http-equiv="Content-Type" content="text/html;

jQuery.sort对DOM元素进行排序

实例: 每个tr的第三列显示的都是数字,我们就以这数字列作为排序依据,方法就是利用jquery的sort()方法. 首先,利用jquery选择器获取每个tr元素,获取回来是一个数据: var $trs = $('#dataTable_table tbody tr'); 然后通过调用jquery的sort()方法进行排序,sort()方法接收的参数是一个方法,该方法就是实现排序的逻辑: $trs.sort(function(a,b){ var valveNumOfa = $(a).find('td

Jquery设置获取DOM元素属性

1, attr() $("button").click(function(){ $("#runoob").attr("href","www.96net.com.cn"); }); 2, 可以传递匿名函数 $("button").click(function(){ $("#runoob").attr("href", function(i,origValue){ retu

替换DOM元素 parent.replaceChild(new, old)

p.replaceChild(nodeNext, p.children[j]); p.replaceChild(nodePrev, p.children[j + 1]);

jQuery简介之dom操作

正文 dom 获取标签 $(选择器): 创建标签对象 $("标签"): 因为返回的都是jQuery对象,所以可以链式调用(任何的jQuery API 返回的都是jQuery对象) 插入标签 内部插入 1.append(content|fn) 概述 向每个匹配的元素内部追加内容. 这个操作与对指定的元素执行appendChild方法,将它们添加到文档中的情况类似. 参数 contentString, Element, jQueryV1.0 要追加到目标中的内容 function(inde

使用html元素的getBoundingClientRect来获取dom元素的时时位置和大小

使用: var section = $('.section'):这是jquery包装的dom元素,其他前端框架返回的可能也是一个包装元素, 我们需要获得的是里面的html的dom元素 然后:section[0]: 获得html的dom元素 然后: 使用section[0].getBoundingClientRect来获取该元素的时时位置和大小

[ jquery 文档处理 replaceWith(content|fn) replaceAll(content) ] 此方法用于把所有匹配的元素替换成指定的HTML或DOM元素

此方法用于把所有匹配的元素替换成指定的HTML或DOM元素 content(String, Element, jQuery, Function) 用于将匹配元素替换掉的内容.如果这里传递一个函数进来的话,函数返回值必须是HTML字符串. fn 返回THML字符串,用来替换的内容. 实例: <html lang='zh-cn'> <head> <title>Insert you title</title> <meta http-equiv='descri