Wie erhalte ich mit jQuery den Wert eines <span>?


148

Das ist grundlegend.

Wie erhalte ich den Wert "Dies ist mein Name" der oben genannten Spanne?

<div id='item1'>
<span>This is my name</span>
</div>

Antworten:


299

Ich denke, das sollte ein einfaches Beispiel sein:

$('#item1 span').text();

oder

$('#item1 span').html();

1
Wo finde ich diese jQuery-Funktionen?
Felipe Barreiros

24
Ich denke, wenn wir diese beiden Funktionen zeigen, ist es wichtig, dass wir neue Codierer nicht verwirren, indem wir vorschlagen, dass sie dasselbe tun, wenn sie es nicht tun (obwohl dies in diesem Beispiel so erscheint). Es ist wichtig zu beachten, dass .text()HTML alle gefundenen Zeichen codiert, während .html()keine Zeichen codiert werden.
VoidKing

Kann dies mit mehreren Bereichen mit derselben Klasse erreicht werden?
Matthew Woodard

Ich bin über diesen Versuch gestolpert, tspan für die Arbeit mit IE herauszufinden. Ich habe festgestellt, dass Sie .text () mit tspan und nicht .html () verwenden müssen. Unsicher warum und es ist möglicherweise nicht bei allen der Fall, aber es wurde im IE behoben, als ich .text () verwendete.
Kalel Wade

@ MatthewWoodard $('.class').each(function() { $(this).html() });; weil $('.class').html()wird den .html () Wert für das erste Element zurückgeben
tomsihap


7

Angenommen, Sie wollten id = "item1" lesen, brauchen Sie

$('#item1 span').text()


5

Da Sie kein Attribut für den Wert 'item' angegeben haben, gehe ich davon aus, dass eine Klasse verwendet wird:

<div class='item1'>
  <span>This is my name</span>
</div>

alert($(".item span").text());

Stellen Sie sicher, dass Sie auf das Laden des DOM warten, um Ihren Code zu verwenden. In jQuery verwenden Sie die folgende ready()Funktion:

<html>
 <head>
  <title>jQuery test</title>
  <!-- script that inserts jquery goes here -->
  <script type='text/javascript'>
    $(document).ready(function() { alert($(".item span").text()); });
  </script>
</head>
<body>
 <div class='item1'>
   <span>This is my name</span>
 </div>
</body>


1
Du hast die Frage geändert! Ihre Antwort ist richtig für Ihre Frage, er gab die ID nicht als Klassennamen an
Lewis

Nun, wenn Sie den ersten Kommentar unter seinem Namen sehen, werden Sie feststellen, dass er überhaupt kein Attribut geschrieben hat. Es war <div 'item1'>, ich habe anscheinend falsch geraten.
Francisco Aquino

2

Würden Sie in Javascript nicht verwenden document.getElementById('item1').innertext?





0

SEHR WICHTIG Zusätzliche Informationen zum Unterschied zwischen .text () und .html ():

Wenn Ihr Selektor mehr als ein Element auswählt, z. B. haben Sie zwei Bereiche wie folgt <span class="foo">bar1</span> <span class="foo">bar2</span> :

dann

$('.foo').text();fügt die beiden Texte hinzu und gibt Ihnen das; wohingegen

$('.foo').html(); gibt Ihnen nur eine davon.


0

Sie können id in span direkt in Ihrem HTML verwenden.

<span id="span_id">Client</span>

Dann wäre Ihr jQuery-Code

$("#span_id").text();

Jemand hat mir geholfen, Fehler zu überprüfen und festgestellt, dass er val () anstelle von text () verwendet hat. Es ist nicht möglich, die Funktion val () in span zu verwenden. So

$("#span_id").val();

wird null zurückgeben.


-2
<script>
    $(document).ready(function () {

            $.each($(".classBalence").find("span"), function () {
            if ($(this).text() >1) {
                $(this).css("color", "green")

            }
            if ($(this).text() < 1) {
                $(this).css("color", "red")
                $(this).css("font-weight", "bold")
            }
        });

    });
    </script>
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.