jQuery解读之after

来源:互联网 发布:中国好声音网络歌手 编辑:程序博客网 时间:2024/04/19 08:03

        一般通过实例去学习jQuery的同学在用过一段时间后往往会感觉jQuery很简单,不用花费太多精力去系统的学,边用边学就行,其实不然,不花时间系统的学习下jQuery的API,就很难真正掌握jQuery,也不能达到灵活运用的地步。我们知道jQuery中对于DOM的操作有很多方法是类似的,如果不去了解其区别,或者不去了解其运用环境,那么在实际运用中就会出现问题。针对jQuery中的一些容易被忽视的地方做一些系列的讲解。

 

        今天讲下after几个容易被忽视的地方,after可能一般就用于在某HTML标签后插入HTML内容。

        1、  after可以用于HTML标签位置的移动,也就是其参数可以是页面中已经存在的HTML标签

代码如下:

<div id="div1">    这是第1个div</div><div id="div2">    这是第2个div</div><script>    $('#div2').after($("#div1"));</script>

运行结果:


        2、基于上述运用场景,对于调用,或者传入的是多个,结果又是怎样的了

代码如下:

<div class="t1">    这是第2个div,样式t1</div><div class="t1">    这是第2个div,样式t1</div><div class="t2">这是第3个div,样式t2</div><div class="t2">    这是第4个div,样式t2</div><script>    $('.t1').after($(".t2"));</script>


运行结果:



         其他几个jQuery的方法,比如insertAfter,before,insertBefore,replaceAll,replaceWith都有上述的情况。

0 0
原创粉丝点击