一、插入

1. append

$("#div").append('<a href="baidu.com">a</a>') ;   // 末尾插入

2. appendTo

$('<a href="baidu.com">a</a>').appendTo($("#div"));  // 末尾插入

$('<div></div>', {
class: 'nstSlider',
'data-range_min': obj.range_min,
'data-range_max': obj.range_max,
}).appendTo(sliderWrap);

3.prepend

$("#content").prepend($('span'));

4.prependTo

$("span").prependTo("#content");     /   $("span").prependTo($("#content"));   // 内容最前方插入指定内容 ,和搬砖一样,有砖是移动,没有就看存不存在可形成的实体,存在就添加,否则啥事不做。

5. before dom外层前方插入

$("p").before("<p>Hello world!</p>");

6. after dom外层后方插入

$("p").after("<p>Hello world!</p>");

7.insertAfter 指定dom外层后方插入

$("<span>你好!</span>").insertAfter("p");

二、包裹

1. wrapInner

$("#div").wrapInner($("<a class='btn'></a>"));   //用 a 包裹住 #div 内容,即 内容加套

2. wrap

$("p").wrap("<div style='border:1px solid red'><p></p></div>");   // 用此结构包裹 匹配的p ,内容及其dom均被裹住,即 外壳加套。

3.wrapAll

$("p").wrapAll("<div style='border:1px solid red'><p></p></div>");  // 创造一个包围圈,把所有匹配元素围起来,不匹配挤到外边,控制台筛选元素不错。。

jq 插入结构的更多相关文章

  1. 使用jq插入节点

    .append()和.appendTo()两种方法功能相同,主要的不同是语法——内容和目标的位置不同 append()前面是要选择的对象,后面是要在对象内插入的元素内容 appendTo()前面是要插 ...

  2. JQ插入节点方法

    1.append()  appendTo()  prepend() prependTo() 2. before() insertBefore() after() insertAfter()

  3. JQ的基本架构

    Jquery的基本架构   引入  以前学习原生JS然后切换到用JQ的时候总觉得很不习惯,甚至有点排斥用JQ.后来自己写项目一直到公司实习用JQ的这段时间,才深深感受到JQ的强大~JQ不仅做到兼容很多 ...

  4. C和C指针小记(十七)-使用结构和指针-链表

    1.链表 链表(linked list)即使是一些包含数据的独立数据结构的(Node)集合. 链表中的每个节点通过链或指针链接在一起. 程序通过指针访问链表中的节点. 节点通常是动态分配的,但也有由节 ...

  5. 六、golang中的结构体和方法、接口

    结构体: 1.用来自定义复杂数据结构 2.struct里面可以包含多个字段(属性) 3.struct类型可以定义方法,注意和函数的区分 4.strucr类型是值类型 5.struct类型可以嵌套 6. ...

  6. 公用表表达式CTE简单递归使用-简单树形结构

    1.建表脚本 CREATE TABLE [dbo].[tb_tree]( ,) NOT NULL, [ParentId] [int] NULL, ) NULL, CONSTRAINT [PK_tb_t ...

  7. 【英语魔法俱乐部——读书笔记】 2 中级句型-复句&合句(Complex Sentences、Compound Sentences)

    [英语魔法俱乐部——读书笔记] 2 中级句型-复句&合句(Complex Sentences.Compound Sentences):(2.1)名词从句.(2.2)副词从句.(2.3)关系从句 ...

  8. GOOGLE PROTOBUF开发者指南

    原文地址:http://www.cppblog.com/liquidx/archive/2009/06/23/88366.html 译者: gashero 目录 1   概览 1.1   什么是pro ...

  9. Jquery的基本架构

    引入  以前学习原生JS然后切换到用JQ的时候总觉得很不习惯,甚至有点排斥用JQ.后来自己写项目一直到公司实习用JQ的这段时间,才深深感受到JQ的强大~JQ不仅做到兼容很多浏览器,还能很方便地使用JS ...

随机推荐

  1. iOS 网易彩票-4设置模块一

    概述 基本上,每一款APP都有相应的设置模块.怎么设置才能更灵活和通用呢,这也是大家一直思考的.下面说说在网易彩票中,设置模块的设置思想. 基本上有三种方案: static cell(呆板,完全没有动 ...

  2. 网站nginx负载下因程序错误导致多节点重复处理请求的解决过程

    目录 前言 问题来了 问题又来了 问题分析 困惑 转机 后续 前言: 这是我上周工作过程中的一次解决问题的过程.解决的是nginx负载环境下,因为应用程序异常导致某一请求被多节点站点重复处理的问题. ...

  3. Summary: 书架问题

    Consider the problem of storing n books on shelves in a library. The order of the books is fixed by ...

  4. 前端开发必备之Chrome开发者工具(上篇)

    本文介绍的 Chrome 开发者工具基于 Chrome 65版本,如果你的 Chrome 开发者工具没有下文提到的那些内容,请检查下 Chrome 的版本 简介 Chrome 开发者工具是一套内置于 ...

  5. 跑道标识和那些复杂的灯光系统 and 简介、编号、参数、标志及数量 and 飞机跑道标准与参数

    http://www.360doc.com/content/16/0616/12/32670666_568219786.shtml http://news.carnoc.com/list/365/36 ...

  6. 命名空间“Microsoft.Office.Interop”中不存在类型或命名空间名称“Excel”。是否缺少程序集引用 的另一种解决方案

    一直以来都是使用tfs进行源代码管理,系统部署也是由我本机生成后发布到服务器上,某一日,进行发布操作时,报了 [命名空间“Microsoft.Office.Interop”中不存在类型或命名空间名称“ ...

  7. Linux系统下C语言程序的构建过程

    本文转载自:http://www.ruanyifeng.com/blog/2014/11/compiler.html 源码要运行,必须先转成二进制的机器码.这是编译器的任务. 比如,下面这段源码(假定 ...

  8. Java EE企业应用发展

    新形式下的企业应用特点企业应用系统从封闭走向开放,由局域网转到互联网,随着涉众面的极大扩展,新的企业应用要求多浏览器支持,国际化支持,全球业务的互联互通.企业需求提升.除了功能性需求,客户对于安全,性 ...

  9. js dom 操作技巧

    1.创建元素 创建元素:document.createElement() 使用document.createElement()可以创建新元素.这个方法只接受一个参数,即要创建元素的标签名.这个标签名在 ...

  10. 修改Nginx配置文件来隐藏index.php

    找到你要修改的域名对应nginx配置文件(vhost下),添加如下代码 location / { if (!-e $request_filename) { rewrite ^(.*)$ /index. ...