jQuery 追加元素、拼接元素的方法总结(append、html、insertBefore、before等)
1. append & appendTo 的功能均为:在被选元素结尾(仍在元素内部)插入指定内容,但是内容和选择器的位置不同
(1) append()方法:
$("#test").append("<p>测试</p>"); //在id为test元素内部末尾插入<p>测试</p>
(2) appendTo()方法:
$("<p>测试</p>").appendTo("#test"); //在id为test元素内部末尾插入<p>测试</p>
2. insertBefore & before & insertAfter & after
(1) insertBefore() & before() 方法 :在被选元素前(元素外部)插入指定内容
$("<p>测试</p>").insertBefore("#test"); //在id为test的元素前插入<p>测试</p>
注:如果指定内容是已存在的元素,它将从它的当前位置被移除,并被插入在被选元素之前。
$("#test").before("<p>测试</p>"); //在id为test的元素前插入<p>测试</p>
(2) insertAfter() & after()方法:在被选元素后(元素外部)插入指定内容
$("<p>测试</p>").insertAfter("#test"); //在id为test的元素后插入<p>测试</p>
注:如果指定内容是已存在的元素,它将从它的当前位置被移除,并被插入在被选元素之后。
$("#test").after("<p>测试</p>"); //在id为test的元素后插入<p>测试</p>
3.html() 方法:设置或返回被选元素的内容
(1) 设置被选元素的内容
$("#test").html("<p>测试</p>"); //将id为test的元素里的内容设置为<p>测试</p>,若元素里面原本有内容,则将原来的内容替换
(2) 返回被选元素的内容
$("p").html(); //返回匹配到的第一个P元素的内容
jQuery 追加元素、拼接元素的方法总结(append、html、insertBefore、before等)的更多相关文章
- jquery追加元素的几种方法(append()、prepend()、after()、before()、insertAfter()、insertBefore())
最近项目不是很忙,抽空整理了下,js中常用追加元素的几种方法. <!DOCTYPE html> <html> <head> <meta charset=&qu ...
- jquery 追加元素/jquery文档处理,插入、修改、移动、删除指定的DOM元素.
jquery 追加元素 $("#content").append("..."); // 添加到元素内部最后面 $("#content").p ...
- js中常用追加元素的几种方法
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- 解析Jquery取得iframe中元素的几种方法
iframe在复合文档中经常用到,利用jquery操作iframe可以大幅提高效率,这里收集一些基本操作,需要的朋友可以参考下 DOM方法:父窗口操作IFRAME:window.frames[&q ...
- jquery数组删除指定元素的方法:grep()
jquery数组删除指定元素的方法:grep() 金刚 数组 jquery javascript 元素 遇到的问题 今天遇到一个问题,删除数组中的一个指定元素,并返回新的数组. 我定义的js数组是这样 ...
- 浅析jQuery中常用的元素查找方法总结
本篇文章是对jQuery中常用的元素查找方法进行了详细的总结和介绍,需要的朋友参考下 $("#myELement") 选择id值等于myElement的元素,id值不能重复在文 ...
- 转:jquery 父、子页面之间页面元素的获取,方法的调用
一.jQuery 父.子页面之间页面元素的获取,方法的调用: 1. 父页面获取子页面元素: 格式:$("#iframe的ID").contents().find("#if ...
- jquery动态添加的元素不能直接应用事件方法的时候
对于由 jQuery 动态生成的元素,如用 jQuery 给元素添加 class,或者直接添加一对 p 标签,不能直接绑定常用的事件,如 click.因为这些元素属于动态生成,除非采用 onclick ...
- Jquery取得iframe中元素的几种方法(转载)
iframe在复合文档中经常用到,利用jquery操作iframe可以大幅提高效率,这里收集一些基本操作 DOM方法:父窗口操作IFRAME:window.frames["iframeSon ...
随机推荐
- 在学习JavaScript中用到的示例
jQuery老师博客 一.定时器示例 功能:让input的文本框,显示时间,并实时更新 逻辑思路: 1.先定义一个函数,用来把当前时间赋值给input.value 2.开始button设置点击事件,并 ...
- Saiku根据入参日期查询出对应的数据(二十)
Saiku根据入参日期查询出对应的数据 之前好像有写过一篇博客关于saiku date range的,现在进一步更新啦!!! 这里的日期筛选会更完善一些,需要提供两个参数 开始日期与结束日期(star ...
- 【持续更新】JAVA面向对象多线程编程的一些tips
sleep()和wait()的区别 sleep()方法是Thread类的方法,wait()方法是Object类的方法. 调用sleep()方法的过程中,线程不会释放对象锁,睡眠时间一过,就又开始执行. ...
- 如何用css实现一个三角形?
昨天被人问到说如何用css实现一个三角形?em.... 当时被问到了,汗颜,今天找了一些帖子看了一下,也算是记录一下吧 代码如下: 实现效果:
- 配置solr6.2
1 解压solr ,把 solr-6.2.0\server\solr-webapp下的 webapp 文件夹拷贝到tomcat 的webapps下,重命名为solr,也可以是其他名字: ( 注意,此处 ...
- 配置jQuery环境
获取最新版jQuery 一.jq库类型说明 jQuery.js(开发版):完整无压缩,主要用于学习.开发和测试 jQuery.min.js(生产版):主要用于产品开发和项目 二.在页面引入 <s ...
- 阶段01Java基础day26反射
27.01_反射(类的加载概述和加载时机) A:类的加载概述 当程序要使用某个类时,如果该类还未被加载到内存中,则系统会通过加载,连接,初始化三步来实现对这个类进行初始化. 加载 就是指将class文 ...
- Excel文件上传功能实现
$(function(){ let file; //上传点击事件 $('#btn').bind('click', function(){ let val = $('#fb').filebox('get ...
- paramiko__摘抄
# -*- coding:utf-8 -*-# Author: Dennis Huang__Author__ = "Dennis" import paramiko # ssh = ...
- Vue+elementui +Springboot session丢失解决方案
前后端分离项目 由于端口不一致会出现跨域问题 解决跨域以后又会出现前后端sessionID不一致 首先跨域问题 跨域可以在前端配置代理 proxyTable: { '/': { / ...