jQuery prepend()和prependTo()方法

在 JavaScript 中，插入節點只有 appendChild( ) 和 insertBefore( ) 兩種方法。不過 jQuery 為我們提供了大量插入節點的方法，極大地方便了我們的操作。

在 jQuery 中，插入節點的方法有以下 4 組。

prepend() 和 prependTo()。
append() 和 appendTo()。
before() 和 insertBefore()。
after() 和 insertAfter()。

本節教學主要介紹 prepend( ) 和 prependTo( ) 方法的用法。

jQuery prepend()方法

在 jQuery 中，我們可以使用 prepend( ) 方法向所選元素內部的“開始處”插入內容。

語法：

$(A).prepend(B)

$(A).prepend(B) 表示往 A 內部的開始處插入 B。

舉例：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
    <style type="text/css">
        p{background-color:orange;}
    </style>
    <script src="js/jquery-1.12.4.min.js"></script>
    <script>
        $(function () {
            $("#btn").click(function() {
                var $strong = "<strong>jQuery教學</strong>";
                $("p").prepend($strong);
            })
        })
    </script>
</head>
<body>
    <p>C語言中文網</p>
    <input id="btn" type="button" value="插入"/>
</body>
</html>

預設情況下，預覽效果如圖 1 所示。

圖 1：預設效果