Chcę dodać element div jako pierwszy element za pomocą jquery przy każdym kliknięciu przycisku
<div id='parent-div'>
<!--insert element as a first child here ...-->
<div class='child-div'>some text</div>
<div class='child-div'>some text</div>
<div class='child-div'>some text</div>
</div>
jquery
prepend
css-selectors
Rana Imtiaz
źródło
źródło
Odpowiedzi:
Spróbuj
$.prepend()
funkcję.Stosowanie
Próbny
źródło
Rozszerzając to, co powiedział @vabhatia, tego chcesz w natywnym JavaScript (bez JQuery).
ParentNode.insertBefore(<your element>, ParentNode.firstChild);
źródło
Zastosowanie:
$("<p>Test</p>").prependTo(".inner");
Zapoznaj się z dokumentacją .prepend na jquery.comźródło
Wstawia węzeł newChild jako element podrzędny parentNode przed istniejącym węzłem podrzędnym refChild. (Zwraca newChild.)
Jeśli refChild ma wartość null, nowyChild jest dodawany na końcu listy dzieci. Równoważnie i czytelniej użyj parentNode.appendChild (newChild).
źródło
Jest to nowy dodatek w (prawdopodobnie) ES7. Jest to teraz waniliowy JS, prawdopodobnie ze względu na popularność w jQuery. Obecnie jest dostępny w Chrome, FF i Opera. Transpilery powinny sobie z tym poradzić, dopóki nie stanie się wszędzie dostępny.
PS Ciągi można dodawać bezpośrednio na początku
Linki: developer.mozilla.org - Polyfill
źródło
Wymagane tutaj
<div class="outer">Outer Text <div class="inner"> Inner Text</div> </div>
dodane przez
$(document).ready(function(){ $('.inner').prepend('<div class="middle">New Text Middle</div>'); });
źródło
$(".child-div div:first").before("Your div code or some text");
źródło
źródło