文档章节

Jquery中的append()和preappend(),after()和before()的区别

 浮云飘飘
发布于 2016/03/22 09:21
字数 217
阅读 283
收藏 0
假设
<div class='a'> //<---you want div c to append in this
  <div class='b'>b</div>
</div>
使用
$('.a').append($('.c'));
则会这样:
<div class='a'> //<---you want div c to append in this
  <div class='b'>b</div>
  <div class='c'>c</div>
</div>
使用
$('.a').prepend($('.c'));
则结果这样:
<div class='a'> //<---you want div c to append in this
  <div class='c'>c</div>
  <div class='b'>b</div>
</div>
after()和before()
同样的上述代码,使用
$('.a').after($('.c'));
结果:
<div class='a'>
  <div class='b'>b</div>
</div>
<div class='c'>c</div> //<----this will be placed here
使用
$('.a').before($('.c'));
结果:
<div class='c'>c</div> //<----this will be placed here
<div class='a'>
  <div class='b'>b</div>
</div>
由上我们可以得出结论:
append() & prepend()实在元素内插入内容(该内容变成该元素的子元素或节点),
after() & before()是在元素的外面插入内容(其内容变成元素的兄弟节点)。

 

 

本文转载自:http://www.myexception.cn/jquery/1992727.html

上一篇: python request
下一篇: jQuery常用的方法
粉丝 23
博文 152
码字总数 95225
作品 0
洛阳
私信 提问
JavaWeb05-HTML篇笔记(一)

1.1上次课内容回顾: JQuery: JQuery的概述:是一个轻量级的JavaScript的类库.对JS进行封装. 常见的JS的框架: JQuery的使用: JQuery的选择器:(*) JQuery实现效果: JQuery样式操作: JQuer...

我是小谷粒
2018/05/10
0
0
UI 设计

UI设计 通过 jQuery,可以很容易地添加新元素/内容。 添加新的 HTML 内容 我们将学习用于添加新内容的四个 jQuery 方法: • append() - 在被选元素的结尾插入内容 • prepend() - 在被选元素...

Ryan小卫
2015/04/28
5
5
jQuery知识总结之DOM操作

本篇文章主要总结一下jQuery中DOM节点的创建、插入、删除与替换以及jQuery中丰富的遍历节点的方法。 jQueryDOM操作之节点创建与属性的处理 JavaScript原生接口创建节点,在处理上是非常复杂与...

03/23
0
0
Jquery关于点击后原导航消失和增加新按钮,点击取消按钮又还原为原导航的问题

底部导航点击一个按键后,原来的导航上的内容消失 出现新的按钮.点击取消按钮后 又显示为原导航。可是第一次可以,在此点击就出现错误。 var delDiv=document.getElementById("delete"); delD...

MyName杨杨杨-
2016/03/23
208
1
jquery之trigger()

这个函数也会导致浏览器同名的默认行为的执行。比如,如果用trigger()触发一个'submit',则同样会导致浏览器提交表单。如果要阻止这种默认行为,应返回false。 <script type="text/javascrip...

freedonn
2014/09/13
177
0

没有更多内容

加载失败,请刷新页面

加载更多

OSChina 周二乱弹 —— 开发语言和语言开发的能一样么

Osc乱弹歌单(2019)请戳(这里) 【今日歌曲】 @花间小酌:#今日歌曲推荐# 分享The Score的单曲《Revolution》 《Revolution》- The Score 手机党少年们想听歌,请使劲儿戳(这里) @批判派...

小小编辑
11分钟前
35
3
oracle ORA-39700: database must be opened with UPGRADE option

ORA-01092: ORACLE instance terminated. Disconnection forced ORA-00704: bootstrap process failure ORA-39700: database must be opened with UPGRADE option 进程 ID: 3650 会话 ID: 29......

Tank_shu
今天
3
0
分布式协调服务zookeeper

ps.本文为《从Paxos到Zookeeper 分布式一致性原理与实践》笔记之一 ZooKeeper ZooKeeper曾是Apache Hadoop的一个子项目,是一个典型的分布式数据一致性的解决方案,分布式应用程序可以基于它...

ls_cherish
今天
4
0
聊聊DubboDefaultPropertiesEnvironmentPostProcessor

序 本文主要研究一下DubboDefaultPropertiesEnvironmentPostProcessor DubboDefaultPropertiesEnvironmentPostProcessor dubbo-spring-boot-project-2.7.3/dubbo-spring-boot-compatible/au......

go4it
昨天
2
0
redis 学习2

网站 启动 服务端 启动redis 服务端 在redis 安装目录下 src 里面 ./redis-server & 可以指定 配置文件或者端口 客户端 在 redis 的安装目录里面的 src 里面 ./redis-cli 可以指定 指定 连接...

之渊
昨天
2
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部