jQuery create element problem.

26. oktober 2015

Hei,
sitter å fikler litt og har ikke vært så mye borti jQuery før så er litt lost, har prøvd å google leenge.

Det jeg prøver på er å lage elementer som er inne i elementer med jQuery, skønner at jeg må bruke append/prepend eller noe men får ikke til i flere nivåer om dere skjønner.
Dette er det jeg prøver å få til med jQuery

HTML-kode

<li class="media media-current-user m-b-md">
                    <div class="media-body">
                          <div class="media-body-text">
                                Text1
                          </div>
                     </div>
</li>

Har foreløpig dette: Hvor messageContainer er en forhåndsdefinert div som hele sulamitten skal legges inn i.

Kode

ChatWidget.prototype._displayMessage = function (message) {

    var newMessage1 = $('<div />', {
        class: 'media-body',

    });

    this.messageContainer.prepend($('<li />', {
        class: 'media media-current-user m-b-md',
    }).prepend(newMessage1));

};

Hvordan får jeg lagt "<div class="media-body-text">
Text1
</div>" inne i media-body div?

tusen takk

hilsen meg

moret

#D4AF37

6.867 6.425

27. oktober 2015

noe sånt feks?

Kode

var s = "Text1";
$('<div />').attr('class','media-body-text').text(s).appendTo('.media-body');

Moff

Limited edition

1.201 950

31. oktober 2015

For å lage elementer pleier jeg å skrive slik:

Kode

$(document.createElement("div"))

Her lager jeg en <div> med native Javascript, ikke JQuery. Dette er rett og slett fordi JQuery er mye tregere enn native (if it ain't broke, don't fix it). Elementet som lages er wrappet inni en JQuery selector, som fanger opp elementet og gjør det klart til bruk i JQuery-kontekst:

Kode

var div = $(document.createElement("div"));
div.addClass("media-body-text");

// Legg det nye <div>-elementet til på nettsiden, i <body>-elementet:
$("body").append(div);

Dette kan du også skrive i ett og samme uttrykk. Hele koden ovenfor kan kjøres ut i én statement, slik:

Kode

$("body").append($(document.createElement("div")).addClass("media-body-text"));

Men nå alt dette er sagt, så kan du jo også bare rendre ut all markup som en string også:

Kode

var message = "Text1";
$("div.media-body").html("<div class=\"media-body-text\">" + message + "</div>");

SecondLife

Trådstarter

54 18

31. oktober 2015

Tusen takk moret

Moff: tusen takk til deg også! Oppfølgingspørsmål; burde jeg holde meg til enten JS eller jQ i hele prosjektet mitt? Og det letteste er vel å bare rendre ut all markup som string som du da. Er det noe spesiell grunn til å ikke gjøre det på den måten? Tusen takk altså.

Nichotin

6.709 4.186

31. oktober 2015

Du må nesten si mer om prosjektet ditt før vi kan gi deg et godt svar, men ut fra det lille jeg ser her høres det nesten ut som du burde se på noe annet enn jQuery, for det kan fort bli tungvint. Et eksempel kan være templatingrammeverket Ractive (kan minne litt om React). Med Ractive sender du dataene du vil vise inn i en template du har laget, og så blir dette om til HTML. Du får også funksjonalitet som toveisbinding med på kjøpet. Ta en kikk på http://ractivejs.org og http://learn.ractivejs.org/hello-world/1/.