您当前的位置: 首页 >  jquery

wespten

暂无认证

  • 0浏览

    0关注

    899博文

    0收益

  • 0浏览

    0点赞

    0打赏

    0留言

私信
关注
热门博文

深入学习jquery源码之append()和prepend()

wespten 发布时间:2018-12-30 12:05:43 ,浏览量:0

 深入学习jquery源码之append()和prepend()

append(content|fn)

概述

向每个匹配的元素内部追加内容。

这个操作与对指定的元素执行appendChild方法,将它们添加到文档中的情况类似。

参数

content String, Element, jQuery

要追加到目标中的内容

function(index, html) Function

返回一个HTML字符串,用于追加到每一个匹配元素的里边。接受两个参数,index参数为对象在这个集合中的索引值,html参数为这个对象原先的html值。

向所有段落中追加一些HTML标记。

I would like to say:

$("p").append("Hello");
[ 

I would like to say: Hello

]

 

appendTo(content)

概述

把所有匹配的元素追加到另一个指定的元素元素集合中。

实际上,使用这个方法是颠倒了常规的$(A).append(B)的操作,即不是把B追加到A中,而是把A追加到B中。

在jQuery 1.3.2中,appendTo, prependTo, insertBefore, insertAfter, 和 replaceAll这个几个方法成为一个破坏性操作,返回值是所有被追加的内容,而不仅仅是先前所选中的元素。所以,要选择先前选中的元素,需要使用end()方法,参见例二。

参数

content String

用于被追加的内容

把所有段落追加到ID值为foo的元素中。

I would like to say:

$("p").appendTo("div");

I would like to say:

I would like to say:

新建段落追加div中并加上一个class

 $("

") .appendTo("div") .addClass("test") .end() .addClass("test2");

 

prepend(content)

概述

向每个匹配的元素内部前置内容。

这是向所有匹配元素内部的开始处插入内容的最佳方式。

参数

content String, Element, jQuery

要插入到目标元素内部前端的内容

function(index, html) Function

返回一个HTML字符串,用于追加到每一个匹配元素的里边。接受两个参数,index参数为对象在这个集合中的索引值,html参数为这个对象原先的html值。

向所有段落中前置一些HTML标记代码。

I would like to say:

$("p").prepend("Hello");
[ 

HelloI would like to say:

]

将一个DOM元素前置入所有段落

I would like to say:

I would like to say:

Hello Good Bye
$("p").prepend( $(".foo")[0] );

HelloI would like to say:

HelloI would like to say:

Good Bye

向所有段落中前置一个jQuery对象(类似于一个DOM元素数组)。

I would like to say:

Hello
$("p").prepend( $("b") );

HelloI would like to say:

 

prependTo(content)

概述

把所有匹配的元素前置到另一个、指定的元素元素集合中。

实际上,使用这个方法是颠倒了常规的$(A).prepend(B)的操作,即不是把B前置到A中,而是把A前置到B中。

在jQuery 1.3.2中,appendTo, prependTo, insertBefore, insertAfter, 和 replaceAll这个几个方法成为一个破坏性操作,要选择先前选中的元素,需要使用end()方法,参见 appendTo 方法的例二。

参数

content String

用于匹配元素的jQuery表达式

把所有段落追加到ID值为foo的元素中。

I would like to say:

$("p").prependTo("#foo");

I would like to say:

 

jquery源码

       jQuery.each({
        appendTo: "append",
        prependTo: "prepend"
    }, function (name, original) {
        jQuery.fn[name] = function (selector) {
            var elems,
                i = 0,
                ret = [],
                insert = jQuery(selector),
                last = insert.length - 1;

            for (; i  1 && typeof value === "string" &&
                !support.checkClone && rchecked.test(value))) {
                return this.each(function (index) {
                    var self = set.eq(index);
                    if (isFunction) {
                        args[0] = value.call(this, index, self.html());
                    }
                    self.domManip(args, callback);
                });
            }

            if (l) {
                fragment = jQuery.buildFragment(args, this[0].ownerDocument, false, this);
                first = fragment.firstChild;

                if (fragment.childNodes.length === 1) {
                    fragment = first;
                }

                if (first) {
                    scripts = jQuery.map(getAll(fragment, "script"), disableScript);
                    hasScripts = scripts.length;

                    // Use the original fragment for the last item instead of the first because it can end up
                    // being emptied incorrectly in certain situations (#8070).
                    for (; i < l; i++) {
                        node = fragment;

                        if (i !== iNoClone) {
                            node = jQuery.clone(node, true, true);

                            // Keep references to cloned scripts for later restoration
                            if (hasScripts) {
                                jQuery.merge(scripts, getAll(node, "script"));
                            }
                        }

                        callback.call(this[i], node, i);
                    }

                    if (hasScripts) {
                        doc = scripts[scripts.length - 1].ownerDocument;

                        // Reenable scripts
                        jQuery.map(scripts, restoreScript);

                        // Evaluate executable scripts on first document insertion
                        for (i = 0; i < hasScripts; i++) {
                            node = scripts[i];
                            if (rscriptType.test(node.type || "") &&
                                !jQuery._data(node, "globalEval") && jQuery.contains(doc, node)) {

                                if (node.src) {
                                    // Optional AJAX dependency, but won't run scripts if not present
                                    if (jQuery._evalUrl) {
                                        jQuery._evalUrl(node.src);
                                    }
                                } else {
                                    jQuery.globalEval((node.text || node.textContent || node.innerHTML || "").replace(rcleanScript, ""));
                                }
                            }
                        }
                    }

                    // Fix #11809: Avoid leaking memory
                    fragment = first = null;
                }
            }

            return this;
        }
    });
	
	

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

关注
打赏
1665965058
查看更多评论
立即登录/注册

微信扫码登录

0.0440s