前三天是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. 开源免费的HTML5游戏引擎——青瓷引擎(QICI Engine) 1.0正式版发布了!

    青瓷引擎的成长 青瓷引擎自2015年4月项目启动开始,7月首次亮相2015年ChinaJoy,便得到业界的极大关注,随后开启限量测试,收到数百个开发者团队的试用申请及反馈,期间经历了18个内测版本,完 ...

  2. [BZOJ 1260][CQOI2007]染色(DP)

    题目:http://www.lydsy.com:808/JudgeOnline/problem.php?id=1260 分析: f[i][j]表示i~j刷成s[i]~s[j]这个样子需要的最小次数 则 ...

  3. java.awt.Robot

    import java.awt.AWTException; import java.awt.Robot; import java.awt.event.KeyEvent; public class Te ...

  4. NumPy 上手一个例子 vectorsum.py

    NumPy系统是Python的一种开源的数值计算扩展.这种工具可用来存储和处理大型矩阵,比Python自身的嵌套列表(nested list structure)结构要高效的多(该结构也可以用来表示矩 ...

  5. ElasticSearch入门系列(一)是什么以及安装和运行

    一.是什么 ElasticSearch是一个基于Apache Lucene的开源搜索引擎. Elasticsearch: 分布式的实时文件存储,每个字段都被所用并可被搜索 分布式的实时分析搜索引擎 可 ...

  6. 【jQuery EasyUI系列】创建CRUD数据网格

    在上一篇中我们使用对话框组件创建了CRUD应用创建和编辑用户信息.本篇我们来创建一个CRUD数据网格DataGrid 步骤1,在HTML标签中定义数据网格(DataGrid) <table id ...

  7. 关于出现 org.apache.commons.lang.exception.NestableRuntimeException的解决方法

    最近做服务端和客户端之间的访问,出现了 org.apache.commons.lang.exception.NestableRuntimeException等状况.实在令人头大,翻到了一个很好的帖子说 ...

  8. ViewHolder数据错乱BUG

    需求是这样的,在列表中用一个图标标示某个item是已经被接下或者完成的任务. 对于文件有这样的操作,进入列表后第一页面展示正常,但是加载更多后同样位置出现了同样的标志.这不是我想要的效果 我的解决办法 ...

  9. 【BZOJ 4515】【SDOI 2016 Round1 Day1 T3】游戏

    考场上写了lct,可惜当时对标记永久化的理解并不是十分深刻,导致调一个错误的程序调了4h+,最后这道题爆0了QwQ 现在写了树链剖分,用标记永久化的线段树维护轻重链,对于$s\rightarrow l ...

  10. jquery-通过js编写弹出窗口

    本文转载 本文主要是通过js动态控制div的高度,css控制浮动 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional// ...