.append(), prepend(), .setelah() dan .sebelum()

Saya cukup mahir dengan coding, tapi sekarang dan kemudian saya menemukan kode yang tampaknya pada dasarnya melakukan hal yang sama. Pertanyaan utama saya di sini adalah, mengapa anda menggunakan .append() ketimbang .setelah() atau sebaliknya ayat-ayat?

Saya telah melihat dan tidak dapat tampaknya menemukan definisi yang jelas dari perbedaan antara dua dan kapan harus menggunakannya dan kapan tidak.

Apa manfaat dari salah satu dari yang lain dan juga mengapa saya menggunakan salah satu ketimbang yang lain?? Dapatkah seseorang tolong jelaskan ini padaku?

var txt = $('#' + id + ' span:first').html();
$('#' + id + ' a.append').live('click', function (e) {
    e.preventDefault();
    $('#' + id + ' .innerDiv').append(txt);
});
$('#' + id + ' a.prepend').live('click', function (e) {
    e.preventDefault();
    $('#' + id + ' .innerDiv').prepend(txt);
});
$('#' + id + ' a.after').live('click', function (e) {
    e.preventDefault();
    $('#' + id + ' .innerDiv').after(txt);
});
$('#' + id + ' a.before').live('click', function (e) {
    e.preventDefault();
    $('#' + id + ' .innerDiv').before(txt);
});
Mohammad
Pertanyaan edit 10 Maret 2017 в 10:53
Pemrograman
append javascript jquery prepend jquery-after
13 Februari 2013 в 4:42
33 tayangan
Mengomentari pertanyaan (2)
Larutan

Lihat:

.append() menempatkan data dalam elemen di terakhir dan .prepend() menempatkan mengawali elem di pertama index

misalkan:


<div class='a'> //
Krzysztof Atłasik
Jawaban edit 8 Maret 2019 в 5:54
Komentar (4)

Ini gambar yang ditampilkan di bawah ini memberikan pemahaman yang jelas dan menunjukkan perbedaan yang tepat antara .append(), .prepend(), .setelah() dan .sebelum()

Anda dapat melihat dari gambar yang .append() dan .prepend() menambah unsur-unsur baru sebagai anak unsur-unsur (berwarna coklat) ke target.

Dan .setelah() dan .sebelum() menambah unsur-unsur baru sebagai saudara unsur-unsur (berwarna hitam) ke target.

Berikut adalah [DEMO][2] untuk pemahaman yang lebih baik.

EDIT: membalik versi dari fungsi-fungsi:

Menggunakan [kode ini](http://jsfiddle.net/BobStein/uczj4ftm/):

var $target = $('.target');

$target.append('<div class="child">1. append</div>');
$target.prepend('<div class="child">2. prepend</div>');
$target.before('<div class="sibling">3. before</div>');
$target.after('<div class="sibling">4. after</div>');

$('<div class="child flipped">or appendTo</div>').appendTo($target);
$('<div class="child flipped">or prependTo</div>').prependTo($target);
$('<div class="sibling flipped">or insertBefore</div>').insertBefore($target);
$('<div class="sibling flipped">or insertAfter</div>').insertAfter($target);

pada target ini:

<div class="target">
    This is the target div to which new elements are associated using jQuery
</div>

Jadi meskipun fungsi-fungsi ini membalik urutan parameter, masing-masing menciptakan satu unsur yang sama bersarang:

var $div = $('<div>').append($(''));
var $img = $('').appendTo($('<div>'))

...tapi mereka kembali elemen yang berbeda. Hal ini penting untuk metode chaining.

Bob Stein
Jawaban edit 20 Desember 2018 в 6:15
Komentar (3)

append() & prepend() adalah untuk memasukkan konten dalam sebuah elemen (membuat konten untuk anak-anak), sementara setelah() & sebelum() memasukkan konten di luar elemen (untuk membuat konten yang saudara).

Komentar (0)

Cara terbaik adalah pergi untuk dokumentasi.

.append() vs .setelah()

  • .append(): Menyisipkan konten, yang ditentukan oleh parameter, akhir setiap elemen dalam himpunan dari unsur-unsur yang cocok.
  • .setelah(): Menyisipkan konten, yang ditentukan oleh parameter, setelah setiap elemen dalam himpunan dari unsur-unsur yang cocok.

.prepend() vs .sebelum()

  • prepend(): Menyisipkan konten, yang ditentukan oleh parameter, awal setiap elemen dalam himpunan dari unsur-unsur yang cocok.
  • .sebelum(): Menyisipkan konten, yang ditentukan oleh parameter, sebelum setiap elemen dalam himpunan dari unsur-unsur yang cocok.

Jadi, append dan tambahkan mengacu pada anak-anak dari objek sedangkan setelah dan sebelum mengacu pada saudara kandung dari objek.

Rohan Gayen
Jawaban edit 16 Juni 2016 в 9:52
Komentar (0)

Ada perbedaan mendasar antara .append() dan .setelah() dan .prepend() dan .sebelum().

.append() menambah parameter elemen di dalam selector elemen's tag di akhir sedangkan .setelah() menambah parameter elemen setelah elemen's tag.

Vice-versa adalah untuk .prepend() dan .sebelum().

[Biola][1]

Komentar (0)

Tidak ada keuntungan tambahan untuk masing-masing dari mereka. Itu benar-benar tergantung pada skenario anda. Kode di bawah ini menunjukkan perbedaan mereka.

    Before inserts your html here
<div id="mainTabsDiv">
    Prepend inserts your html here
    <div id="homeTabDiv">
        <span>
            Home
        </span>
    </div>
    <div id="aboutUsTabDiv">
        <span>
            About Us
        </span>
    </div>
    <div id="contactUsTabDiv">
        <span>
            Contact Us
        </span>
    </div>
    Append inserts your html here
</div>
After inserts your html here
Komentar (0)
 

<div></div>    
//
Nate
Jawaban edit 31 Maret 2015 в 9:07
Komentar (0)

Bayangkan DOM (halaman HTML) seperti pohon yang tepat. Elemen HTML adalah simpul dari pohon ini.

The append() menambah node baru untuk anak dari node yang anda sebut itu. 

Example:$("#mydiv").append("<p>Hello there</p>") 

creates a child node <p> to <div>

Setelah() menambah node baru sebagai saudara kandung atau pada tingkat yang sama atau anak ke orang tua dari simpul yang anda sebut itu.

neshpro9
Jawaban edit 2 Juni 2014 в 9:55
Komentar (0)

Untuk mencoba dan jawaban anda yang utama ** pertanyaan:

mengapa akan anda gunakan .append() agak kemudian .setelah() atau sebaliknya ayat-ayat?

Ketika anda memanipulasi DOM dengan jquery metode yang anda gunakan tergantung pada hasil yang anda inginkan dan yang sering digunakan adalah untuk mengganti konten.

Dalam mengganti konten yang ingin anda .hapus() isi dan menggantinya dengan konten baru. Jika anda .hapus() ada tag dan kemudian mencoba untuk menggunakan .append() tidak't bekerja karena tag itu sendiri telah dihapus, sedangkan jika anda menggunakan .setelah(), konten baru ditambahkan 'di luar' (sekarang dihapus) tag dan isn't dipengaruhi oleh sebelumnya.hapus().

Michael Durrant
Jawaban edit 19 Maret 2016 в 12:13
Komentar (0)