JQuery: öğe setini başka bir setle değiştirmenin zarif yolu?

BenJQuery: öğe setini başka bir setle değiştirmenin zarif yolu?

<div> 
    <div class="stuff"/> 
    <div class="stuff"/> 
    <div class="stuff"/> 
</div>

gibi DOM bir grup var ve ben Ajax yoluyla getirilmez şeyler

<div> 
    <div class="stuff"/> 
    <p class="stuff"/> 
    <ul class="stuff"/> 
    <a class="stuff"/> 
</div>

yeni bir dizi ile değiştirmek istiyorum. Sorum şu: Bunu yapmanın en iyi yolu nedir?

$.replaceWith tam olarak ne istediğimi yapmıyor, çünkü daha sonra yeni stuff'un birden çok kopyasını elde ediyorum.

Bütün stuff bir bitişik blok içinde olacağını garanti edebilir ve böylece muhtemelen son öğeden sonra bazı yer tutucu koymak olabilir (veya ilk elemana öncesi) eski stuff arasında, eski stuff kaldırmak ve yerine Yeni stuff ile yer tutucu. Bununla birlikte, bu durum, dönel kavşak ve sağlam gibi görünmemektedir. Tüm eski stuff'u kaldırarak ve yeni stuff'un tek bir kopyasını tek bir seferde koymanın akıllıca bir yolu var mı?

DÜZENLEME: Ayrıca herhangi bir kapsayıcı div kullanmadan da yapmak isterim. Kullanılması konteyner div'ler Yukarıdaki durumda çalışacağını, ancak stuff içinde olduğu zaman gibi, bazı durumlarda başarısız olacak bir <table>:

<table> 
    <head/> 
    <body> 
     <tr/> 
     <tr class="stuff"/> 
     <tr class="stuff"/> 
     <tr class="stuff"/> 
     <tr/> 
    </body> 
</table>

i belki daha fazla, satır başka bir dizi ile stuff etiketlenmiş satırları değiştirmek istiyorsanız Muhtemelen daha az, <body> sadece <tr> s (IIRC) içerebileceğinden, bunları HTML'yi kırmadan bir kapsayıcı şeylere güzel bir şekilde koymamın bir yolu yoktur.

kaynak

2012-05-23 Li Haoyi

HTML biçimlendirmesi yanlış görünüyor! – thecodeparadox

Ne denediniz ki bu zarif değil mi? Bunu yapmanın birçok yolu var, hangisini denedin? – Joseph

@codecodeparadox işaretlemeyi düzeltti. Joseph: tüm insert-yer tutucu, eski şeyler kaldırmak, yer tutucu değiştirmek –

$('#outerdiv').empty().append(newContent);

.html() aksine, bu ne olursa olsun newContent bir HTML dize veya varolan DOM yapısı olup olmadığının çalışacaktır.

orada birden elemanları değiştirilecek olan ama onların kardeşleri korumak gereken yere, bunu yapabiliyorsa:

$('.stuff').first().before(newContent).end().remove();

yani ilk .stuff eleman almak ondan önce yeni içerik eklemek ve sonra kaldırmak tüm .stuff öğeleri. o "zarif" testini geçerse

$('.stuff').wrapAll('<div/>').parent().replaceWith('<div class="stuff"/>');

Emin değilim, ama ne olursa olsun içeren başka içerik olup olmadığına bakılmaksızın çalışır:

kaynak

2012-05-23 15:48:10 Alnitak

Bu işe yarıyor, sanırım" zarafet "testinden geçiyor. Teşekkürler =) –

Evet: $('#tagetDiv').html(newContent)

kaynak

2012-05-23 15:45:57

Bunu yapmak için herhangi bir konteyner div gerektirmemek istediğimi indirmeliydim. Bir konteyner div/span'a sahip olmak çoğu durumda çalışır, ancak bazen (sinir bozucu!) Kenarlarda başarısız olur (konteyner divs CSS biçimlendirmesini bozar, bir tablonun gövdesini/başını/satırlarını/hücrelerini değiştirir, vs.). –

@LiHaoyi Bir konteyneriniz yoksa _which_ divs 'i nasıl değiştireceğini biliyorsunuz? – Alnitak

@Alnitak: Tüm divs tarafından paylaşılan "stuff" sınıfına göre, –

bir yolu wrapAll ile olacağını yapmak öğesi. Bununla birlikte, bunun basit bir soruna çok karmaşık bir çözüm olduğu söylenir. Basit çözüm, öğelerinizi içeren bir öğeye sarmak olurdu; Bu her zaman birlikte olacaklarını garanti ederseniz, bu bir sorun olmamalı.

kaynak

2012-05-23 15:48:30 lonesomeday

JQuery: öğe setini başka bir setle değiştirmenin zarif yolu?

cevap

İlgili konular