JQuery bekommen alle Elemente nach Klassennamen

in den Prozess des Lernens Javscript und Jquery, ging durch Seiten von Google, aber kann nicht scheinen, dass dies funktioniert. Im Grunde versuche ich, innere Klassen zu sammeln, jquery scheint als einfaches Javascript in einem document.write vorgeschlagen zu werden.JQuery bekommen alle Elemente nach Klassennamen

Hier ist der Code so weit;

<div class="mbox">Block One</div> 
<div class="mbox">Block Two</div> 
<div class="mbox">Block Three</div> 
<div class="mbox">Block Four</div> 

<script> 
var mvar = $('.mbox').html(); 
document.write(mvar); 
</script>

Damit wird nur die erste Klasse unter document.write angezeigt. Wie kann ich alles wie Block OneBlock TwoBlock Three zusammen zeigen? Mein ultimatives Ziel ist es, ihnen ein Komma zu zeigen, das wie Block Eins, Block Zwei, Block Drei, Block Vier getrennt ist. Danke, es gibt eine Menge relevanter Fragen, aber keine scheint so einfach zu sein.

Quelle

2013-05-19 Jake

mit' document.write' wird nicht empfohlen. –

Eine Möglichkeit ist .map() Methode zu verwenden:

var all = $(".mbox").map(function() { 
    return this.innerHTML; 
}).get(); 

console.log(all.join());

DEMO:http://jsfiddle.net/Y4bHh/

N. B. Bitte verwenden Sie nicht document.write. Zu Testzwecken ist console.log der beste Weg zu gehen.

Quelle

2013-05-19 00:08:01 VisioN

Vielleicht nicht so sauber oder effizient wie die bereits geposteten Lösungen, aber wie wäre es mit der Funktion .each()? Z. B:

var mvar = ""; 
$(".mbox").each(function() { 
    console.log($(this).html()); 
    mvar += $(this).html(); 
}); 
console.log(mvar);

Quelle

2013-05-19 00:14:01 kufudo

Ich würde sagen, das ist die kanonische Antwort (und der erwartete Anwendungsfall von 'each') – Samveen

Alternative Lösung (Sie createelement mit Ihrem eigenen Element ersetzen kann)

var mvar = $('.mbox').wrapAll(document.createElement('div')).closest('div').text(); 
console.log(mvar);

Quelle

2013-05-19 00:19:06 Sam

Sie sind nur die erste der vier Einträge bekommen von diesem Selektor zurückgegeben.

-Code unten als Geige: http://jsfiddle.net/7pUa3/

Ich möchte allzu klar sein, dass Sie vier Elemente, die die Wähler abgestimmt, so dass Sie mit jedem explizit befassen müssen. Verwenden Sie eq() ist ein wenig expliziter machen diesen Punkt als die Antworten mit map, obwohl map oder each ist, was Sie wahrscheinlich "im wirklichen Leben" (jquery docs for eq here) verwenden würden.

<html> 
    <head> 
     <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" ></script> 
    </head> 

    <body> 
     <div class="mbox">Block One</div> 
     <div class="mbox">Block Two</div> 
     <div class="mbox">Block Three</div> 
     <div class="mbox">Block Four</div> 

     <div id="outige"></div> 
     <script> 
      // using the $ prefix to use the "jQuery wrapped var" convention 
      var i, $mvar = $('.mbox'); 

      // convenience method to display unprocessed html on the same page 
      function logit(string) 
      { 
       var text = document.createTextNode(string); 
       $('#outige').append(text); 
       $('#outige').append("<br>"); 
      } 

      logit($mvar.length); 

      for (i=0; i<$mvar.length; i++) { 
       logit($mvar.eq(i).html()); 
      } 
     </script> 
    </body> 

</html>

Ausgabe von logit Anrufe (nach der ersten vier div ‚s Display):

4 
Block One 
Block Two 
Block Three 
Block Four

Quelle

2013-05-19 00:31:13 ruffin

JQuery bekommen alle Elemente nach Klassennamen

Antwort

Verwandte Themen