前三天是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. K-means算法和矢量量化

    语音信号的数字处理课程作业——矢量量化.这里采用了K-means算法,即假设量化种类是已知的,当然也可以采用LBG算法等,不过K-means比较简单.矢量是二维的,可以在平面上清楚的表示出来. 1. ...

  2. 怎样关闭google的自动更新

    谷歌的自动更新很烦人的,只要你点击关于Google Chrome,谷歌就会自动更新成最新版本. 但是sencha框架好像与谷歌29.0以上的兼容性不是很好,所以关闭谷歌自动更新的需求来了,网上很多人说 ...

  3. 转一篇关于如何在Unity里使用Protobuf

    原帖地址: http://purdyjotut.blogspot.com/2013/10/using-protobuf-in-unity3d.html 先转过来,等时间合适了,再来收拾 Using P ...

  4. android之Activity回传数据

    约定:当Activity发生跳转时将原来的Activity成为父Activity,将新出现的Activity成为子Activity. 情景设置 下面是个发短信的Activity 当我们点击图中的+按钮 ...

  5. 【转】java.util.ResourceBundle使用详解

    原文链接:http://lavasoft.blog.51cto.com/62575/184605/ 人家写的太好了,条理清晰,表达准确.   一.认识国际化资源文件   这个类提供软件国际化的捷径.通 ...

  6. 第七章 java基础类库

    1. 日期时间: 用Calendar类. 2. 分隔符:空格.tab.回车. 3. Scanner:读取键盘输入.读取文件. 4. 系统类: System  Runtime. 5. 所有的java类都 ...

  7. Android下常见的四种对话框

    摘要:在实际开发过程有时为了能够和用户进行很好的交互,需要使用到对话框,在Android中常用的对话框有四种:普通对话框.单选对话框.多选对话框.进度对话框. 一.普度对话框 public void ...

  8. jquery渐渐的显示、隐藏效果

    <!DOCTYPE html> <html> <head> <meta charset="gb2312" /> <title& ...

  9. Query DSL for elasticsearch Query

    Query DSL Query DSL (资料来自: http://www.elasticsearch.cn/guide/reference/query-dsl/) http://elasticsea ...

  10. [转]Null value was assigned to a property of primitive type setter of"原因及解决方法

    原文地址:http://blog.csdn.net/kevinzhangfei/article/details/6995316 在action请求数据的过程中报出"Null value wa ...