jQuery文档操作之插入操作
append()
语法
>父元素.append(子元素)
解释:追加某元素,在父元素中添加新的子元素。子元素可以为:string/element(js对象)/jQuery元素
代码如下:
var oli = document.createElement("li");
oli.innerHTML = "哈哈哈";
$("ul").append("<li>123</li>");
$("ul").append("oli");
$("ul").append($("#app"));
PS:如果追加的是jQuery对象,那么这些元素将从原位置上消失。简单来说,就是一个移动操作。
appendTo()
语法:
>子元素.appendTo(父元素)
解释:追加到某元素,子元素添加到父元素
代码示例:
$("<li>This is the first.</li>").appendTo($("ul")).addClass("active")
PS:要添加的元素同样既可以是string/element(js对象)/jQuery元素
prepend()
语法:
>父元素.prepend(元子素);
解释:前置添加,添加到父元素的第一个位置
$("ul").prepend("<li>This is the first.</li>")
prependTo()
语法:
>子元素.prependTo(父元素);
解释:前置添加,添加到父元素的第一个位置
$("<li>This is the first.</li>").prependTo("ul");
after()
语法:
>兄弟元素.after(要插入的兄弟元素)
解释:在匹配的元素之后插入内容
$("ul").after('<h4>我是一个标题</h4>')
inserAfter()
语法:
>要插入的兄弟元素.inserAfter(兄弟元素);
解释:在匹配的元素之后插入内容
$("<h5>我是一个标题</h5>").inserAfter("ul");
before()
语法:
>兄弟元素.before(要插入的兄弟元素);
解释:在匹配的元素之前插入内容
$("ul").before('<h3>我是一个标题</h3>');
inseBefore
语法:
>要插入的兄弟元素.inseBefore(兄弟元素);
解释:在匹配的元素之前插入内容
$("h5>我是一个标题</h5").inseBefore("ul");
jQuery文档操作之插入操作的更多相关文章
- jQuery 效果函数,jquery文档操作,jQuery属性操作方法,jQuerycss操作函数,jQuery参考手册-事件,jQuery选择器
jQuery 效果函数 方法 描述 animate() 对被选元素应用“自定义”的动画 clearQueue() 对被选元素移除所有排队的函数(仍未运行的) delay() 对被选元素的所有排队函数( ...
- jQuery 文档操作 - prependTo() ,appendTo()方法
其他jquery文档操作方法:http://www.w3school.com.cn/jquery/jquery_ref_manipulation.asp jQuery 参考手册 - 文档操作 appe ...
- jQuery 核心 - noConflict() 方法,jQuery 文档操作 - detach() 方法
原文地址:http://www.w3school.com.cn/jquery/manipulation_detach.asp 实例 使用 noConflict() 方法为 jQuery 变量规定新 ...
- jquery.cookie 使用文档,$.cookie() 文档教程, js 操作 cookie 教程文档。
jquery.cookie 使用文档,$.cookie() 文档教程, js 操作 cookie 教程文档. jquery.cookie中的操作: jquery.cookie.js是一个基于jquer ...
- jQuery文档操作
jQuery文档操作 1.jq文档结构 var $sup = $('.sup'); $sup.children(); // sup所有的子级们 $sup.parent(); // sup的父级(一个, ...
- HTML jQuery 文档操作 - html() 方法
jQuery 文档操作 - html() 方法 jQuery 文档操作参考手册 实例 设置所有 p 元素的内容: $(".btn1").click(function(){ $(&q ...
- C# 中使用Word文档对图像进行操作
C# 中使用Word文档对图像进行操作 Download Files: ImageOperationsInWord.zip 简介 在这篇文章中我们可以学到在C#程序中使用一个Word文档对图像的各种操 ...
- MongoDB文档的增删改操作
上一篇文章中介绍了MongoDB的一些基本知识,同时看到了怎么启动一个MongoDB服务,并且通过MongoDB自带的shell工具连接到了服务器. 这一次,就通过MongoDB shell介绍一下对 ...
- jQuery文档就绪事件
[jQuery文档就绪事件] 为了防止文档在完全加载(就绪)之前运行 jQuery 代码.如果在文档没有完全加载之前就运行函数,操作可能失败. $(document).ready(function() ...
- jQuery 文档操作方法
jQuery 文档操作方法 这些方法对于 XML 文档和 HTML 文档均是适用的,除了:html(). 方法 描述 addClass() 向匹配的元素添加指定的类名. after() 在匹配的元素之 ...
随机推荐
- ZOOKEEPER进阶
集群个数: 2n+1,因为集群当宕机大于等于二分之一的机子时,集群选举会失败.故 2n+1台机器和3n台机器可靠性相同 Leader的作用: 为了实现各个节点数据的一致性,需要一个负责协调数据同步的操 ...
- 【weixin】微信企业号和公众号区别和关系是什么?
在移动互联网快速发展和智能手机普遍应用的时代环境下,随着微信平台应用不断扩大和微信用户的迅速增加,微信公众号运营也有了很大的发展,企业.机构和个人纷纷迈入微信公众号运营的行列.微信公众号就是在微信公众 ...
- nginx之配置
1)反向代理(Reverse Proxy)方式是指以代理服务器来接受internet上的连接请求,然后将请求转发给内部网络上的服务器,并将从服务器上得到的结果返回给internet上请求连接的客户端, ...
- 关于Webpack打包报错Class constructor FileManager cannot be invoked without 'new'
前端代码部署一直是自己打包之后将文件用FileZilla上传到服务器上,现在改用运维基于到k8s docker镜像的发布,前端打包报错如下: 经查资料,报错原因是less升级导致的Bug 尝试升级le ...
- IIS 6.0 PUT上传 任意文件创建漏洞
IIS 6.0 PUT上传 任意文件创建漏洞 require 1.IIS Server在Web服务扩展中开启了WebDAV. 2.IIS配置了可以写入的权限,包括网站 1.根目录 2.子文件夹 3.i ...
- Python中文分词组件 jieba
jieba "结巴"中文分词:做最好的Python中文分词组件 "Jieba" Feature 支持三种分词模式: 精确模式,试图将句子最精确地切开,适合文本分 ...
- Vue异步请求最佳实践
一.当前存在的问题 目前项目前端请求后台数据的方式是这样的: 页面中method中dispatch到action action调用mutation,请求axios 请求到数据后存储到state中 页面 ...
- 面向对象相关概念与在python中的面向对象知识(魔法方法+反射+元类+鸭子类型)
面向对象知识 封装 封装的原理是,其成员变量代表对象的属性,方法代表这个对象的动作真正的封装是,经过深入的思考,做出良好的抽象(设计属性时用到),给出“完整且最小”的接口,并使得内部细节可以对外透明( ...
- Linux内核网络报文简单流程
转:http://blog.csdn.net/adamska0104/article/details/45397177 Linux内核网络报文简单流程2014-08-12 10:05:09 分类: L ...
- SQL语句复习【专题六】
SQL语句复习[专题六] 用户 + 创建表 --创建一个新的用户,然后给新的用户创建一张表,然后给表中添加一些数据.查询表中的数据 --创建用户需要比较大的权限 DBA create user di ...