jquery插入,复制、替换和删除节点
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>jQuery插入,复制、替换和删除节点</title>
<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
//几种添加节点的方法
//$("p").append("<b>你好吗？</b>");//向p元素中追加《b》
//$("<b>你好吗？</b>").appendTo("p");//将《b》追加到p元素中
//$("p").prepend("<b>你好吗？</b>");//向p中前置《b》
//$("<b>你好吗？</b>").prependTo("p");//将《b》前置到p元素中
//$("p").after("<b>你好吗？</b>");//向p元素后插入《b》
//$("<b>你好吗？</b>").insertAfter("p");//将《b》插入到p元素后边
//$("p").before("<b>你好吗？</b>");//在p元素之前添加《b》
//$("<b>你好吗？</b>").insertBefore("p");//将《b》插入到p元素前面
//几种删除节点的方法
//var $li=$("ul li:eq(1)").remove();//删除ul节点中第2个元素节点
//$("ul").append($li);//把刚删除的元素节点从新添加到ul元素中去
//$("ul li").remove("li[title!=菠萝]");//将ul元素下title属性不等于"菠萝"的li元素删除
//$("ul li:eq(1)").empty();//清空ul节点下第2个li元素的内容
//复制节点
/* $("ul li").click(function(){
$(this).clone(true).appendTo("ul");//复制当前点击的节点，并将它追加到《ul》元素中，当添加参数时复制它的事件
});
*/
//替换节点
//$("p").replaceWith("<strong>你最不喜欢的水果是？</Strong>");
$("[name='rp']").replaceWith("<tr><td>gg</td><td>gg</td><td>gg</td><td>gg</td></tr><tr><td>gg</td><td>gg</td><td>gg</td><td>gg</td></tr>");
});
</script>
</head>
<body>
<p>你好！</p>
你最喜欢的水果是？
<ul>
<li title="苹果">苹果</li>
<li title="橘子">橘子</li>
<li title="菠萝">菠萝</li>
</ul>
</body>
</html>
jquery插入,复制、替换和删除节点的更多相关文章
- jQuery:节点(插入,复制,替换,删除)操作
<html> <head> <meta http-equiv="Content-Type" content="text/html; char ...
- JavaScript 对图像进行（追加，插入，替换，删除）
JavaScript 对图像进行(追加,插入,替换,删除) 本次所学内容: document.querySelector('.container') 这个是可以查找单个[id标签和class标签] d ...
- JQuery_DOM 节点操作之复制、替换和 删除节点
一.复制节点 <script type="text/javascript" src="jquery-1.12.3.min.js"></scri ...
- C#语言————拼接、插入、替换、删除四种方法
StringBuilder sb = new StringBuilder("hello"); sb.Append("world");//拼接 sb.Insert ...
- C++中对字符串进行插入、替换、删除操作
#include <iostream> #include <string> using std::cout; using std::endl; using std::strin ...
- Query节点操作，jQuery插入节点，jQuery删除节点，jQuery Dom操作
一．创建节点 var box = $('<div>节点</div>'); //创建一个节点,或者var box = "<div>节点</div> ...
- jQuery节点操作，jQuery插入节点，jQuery删除节点，jQuery Dom操作
一．创建节点 1 var box = $('<div>节点</div>'); //创建一个节点,或者var box = "<div>节点</div& ...
- 浅析jQuery删除节点的三个方法
jQuery提供了三种删除节点的方法,即remove(),detach()和empty().测试所用HTML代码:[html] view plaincopy<p title="选择你最 ...
- jquery -- 删除节点
jQuery提供了三种删除节点的方法,即remove(),detach()和empty(). 测试所用HTML代码: <p title="选择你最喜欢的水果?">你最喜 ...
随机推荐
- Spring Boot 整合mybatis 使用多数据源
本人想要实现一个项目里面多个数据库源连接,所以就尝试写一个demo,不多说,先贴结构,再贴代码,可以根据以下的顺序,直接copy解决问题. 首先,dao和resource下的mappers可以用myb ...
- xbeePROS1发送的数据在802.15.4网络中有多大时延？
完整的计算过程请参考Digi官方网站的文章:Sending data through an 802.15.4 network latency timing. Digi的S1模块可以跑802.15.4固 ...
- vue中鼠标移入字体下面显示颜色并改变字体颜色的问题
<template> <div class="smart_nav" :class="{'fixedTop':fixedTop}"> &l ...
- sql server中replace()函数用法解析
知识点一:replace()的语法 REPLACE ( string_replace1 , string_replace2 , string_replace3 ) 参数解析: string_repla ...
- vue使用路由跳转到上一页
this.$router.go(-1) <template> <div> <button class="btn btn-success" @click ...
- springMVC一个Controller处理所有用户请求的并发问题（转）
springMVC一个Controller处理所有用户请求的并发问题 有状态和无状态的对象基本概念: 有状态对象(Stateful Bean),就是有实例变量的对象 ,可以保存数据,是非线程安全的.一 ...
- 微服务日志之.NET Core使用NLog通过Kafka实现日志收集
一.前言 NET Core越来越受欢迎,因为它具有在多个平台上运行的原始.NET Framework的强大功能.Kafka正迅速成为软件行业的标准消息传递技术.这篇文章简单介绍了如何使用.NET(Co ...
- vue-cli脚手架项目按需引入elementUI
https://www.jianshu.com/p/40da0ba35ac1 Couldn't find preset "es2015" relative to directory ...
- JavaScript中的定时事件
这两个函数都是在给定的时间之后开始执行的,并不是立即执行. var timeId = window.setTimeout("method()",1000); //定时执行,还可以这 ...
- typescript handbook 学习笔记2
概述 这是我学习typescript的笔记.写这个笔记的原因主要有2个,一个是熟悉相关的写法:另一个是理清其中一些晦涩的东西.供以后开发时参考,相信对其他人也有用. 学习typescript建议直接看 ...