前三天是jQuery的基础部分,选择器学好了。才能进行下一步的操作,如果前三天没学过没学好,不要跳着学。粗俗的话叫做,步子大了,容易扯着蛋。一步一个脚印,是最好的方式。

强调一下。有问题,不要憋着不讲。评论区里可以尽情提问,有问题才是好孩子。


jQuery插入节点的方法:

插入节点主要有两种方式,一种是内插,一种是外插。外插花样多,还分前插和后插。各位看官自动脑补岛国动画,只要你能记住,我拦不住您瞎想。

本着no picture no bibi 的精神。我画几个图,对比学习。当然更好的是你自己练一下。

内插:

     append 与 appendTo

   prepend 与 prependTo

   多图来袭:

   内插中的后插:

   

 

内插中的前插:

   

  其中append与appendTo的作用是类似的。都是在元素的内部内容后面插入元素。不过为了jQuery的链式操作方便。可以先指定插入的内容然后再插入到元素内。

  区别在于:append:先准备插入的元素,再准备插入的内容。eg:$('p').append("<b>我解锁了前插中的后插</b>");

         appendTo:先准备插入的内容,然后再插入到元素中去。eg $("<b>我解锁了前插中的后插</b>").appendTo("p");

外插:

   after 与 insertAfter

before 与 insertBefore

     外插中的后插:

   

      

    外插中后插:

   

                after 与 insertAfter作用是类似的。可以参考内插的介绍。


实在抱歉,今天更新的内容太少了。自己的电脑不太好,画图太不好使了。有问题,或者有错误,评论区见。

jQuery知识点总结(第四天)的更多相关文章

  1. jQuery绑定事件的四种方式

      jQuery提供了多种绑定事件的方式,每种方式各有其特点,明白了它们之间的异同点,有助于我们在写代码的时候进行正确的选择,从而写出优雅而容易维护的代码.下面我们来看下jQuery中绑定事件的方式都 ...

  2. jQuery组织您钞四----jQuery操作DOM

    一.采用jQuery创建节点 节点是DOM基础设施.依据DOM产品规格,Node是一个很宽泛的概念,包含元素.属性.正文.档..实际开发过程中,要创建动态内容,主要操作的节点包括元素. 属性和文本. ...

  3. jQuery绑定事件的四種方式

    这篇文章主要介绍的是jQuery绑定事件的四种方式相关内容,下面我们就与大家一起分享. jQuery绑定事件的四种方式 jQuery提供了多种绑定事件的方式,每种方式各有其特点,明白了它们之间的异同点 ...

  4. [独孤九剑]Oracle知识点梳理(四)SQL语句之DML和DDL

    本系列链接导航: [独孤九剑]Oracle知识点梳理(一)表空间.用户 [独孤九剑]Oracle知识点梳理(二)数据库的连接 [独孤九剑]Oracle知识点梳理(三)导入.导出 [独孤九剑]Oracl ...

  5. jQuery绑定事件的四种方式区别

    jQuery中提供了四种事件监听方式,分别是bind.live.delegate.on,对应的解除监听的函数分别是unbind.die.undelegate.off.在开始看他们之前 一:bind(t ...

  6. jQuery绑定事件的四种方式:bind、live、delegate、on

    1.jQuery操作DOM元素的绑定事件的四种方式 jQuery中提供了四种事件监听方式,分别是bind.live.delegate.on,对应的解除监听的函数分别是unbind.die.undele ...

  7. jQuery事件绑定的四种方法

    jQuery中提供了四种绑定事件的方法,分别是bind.live.delegate.on,对应的解除监听的函数分别是unbind.die.undelegate.off: 一.on()方法(首选方法) ...

  8. JQuery知识点总结

    一. 1.JavaScript是Netscape公司开发的一种脚本语言(scripting language).JavaScript的出现实现了使得网页和用户之间实时的,动态的和交互的关系,使网页包含 ...

  9. jQuery学习笔记(四)jQuery中的动画

    目录 show()方法和hide()方法 fideIn()方法和fadeOut()方法 slideUp方法和slideDown()方法 自定义动画方法animate toogle(),slideTog ...

随机推荐

  1. 以HTML为表现的日志记录组件

    日志搬家:http://www.loogn.net/blog/Article.aspx?id=21 关于日志记录,如果你不想随用随写,又不想用log4net的话,也许你可以了解一下这个! 我也是个很懒 ...

  2. xml序列化及反序列化.net对象

    序列化一个类通常添加[XmlRoot("根节点名字")] 找到要序列化的内容 对要序列化的类添加 [Serializable]属性用于序列化 对于要序列化的字段添加  [XmlEl ...

  3. 基于FPGA的电压表与串口通信(下)

    实验操作 上电 接入5V电源,用配套的线,USB那端接电脑即可: 电源开关 按下电源开关 接串口线 接下载线 现在电脑装串口线驱动 R340qd.zip 双击进行安装 设置串口调试助手 Com1要根据 ...

  4. ASimpleCache使用感受

    一.简介 ASimpleCache只能作为一份教程,一个学习样板,不能当真把它当回事. 作者杨福海,Afinal框架也是他创造的. 可是我读ASimpleCache的900行代码时,发现各种难看,并且 ...

  5. android开发------编写用户界面之线性布局(补充知识)

    在前面的文章中 http://www.cnblogs.com/ai-developers/p/android_linearlayout.html 我们看到了布局中有这样一个属性: layout_wei ...

  6. navigationView 的使用和布局文件的绑定

    今天项目进行到了细化内容的部分啦- 需要美化侧滑菜单,并且填充数据.在博客上看了好久发现大家的都大同小异 而且很少有提到如何绑定内容各处求助终于在一片博客上发现了蛛丝马迹!!上大神的帖子:blog.c ...

  7. 作业成绩 final 20161124-1201 09:00

    final阶段,20161124-1201 09:00. 申诉截止时间 20161206 12:00,微信联系杨贵福. 凡描述需求或BUG时,应给出以下4项: 你期待看到的现象如何 你实际看到的现象 ...

  8. canvas判断边距,反弹和拖拽的综合实例

    效果如图所示,可以实现精准拖拉和触界反弹 var canvas = document.getElementById("canvas"); var cxt = canvas.getC ...

  9. MySQL的启动脚本

    MySQL的启动脚本#!/bin/bashmysql_port=3308mysql_username="admin"mysql_password="password&qu ...

  10. mysql 存储过程和存储函数

    14.1.1 创建存储过程 MySQL中,创建存储过程的基本形式如下: CREATE PROCEDURE sp_name ([proc_parameter[,...]]) [characteristi ...