Javascript sichtbares Element

Question

Der HTML-Code nicht definiert Zurückkehren, die ich zu klicken bin versucht

<button type="submit" class="flatbutton">Send</button>

var i; 
var button = document.getElementsByClassName("flatbutton"); 
    for (i = 0; i < button.length; ++i) { 
     if (button[i].type == "submit") { 
      console.log(button[i].innertext); 
     } 
    } 

Aus irgendeinem Grund alles, was zurückgegeben wird, nicht definiert ist. Dies macht keinen Sinn, es sollte "Senden" zurückgeben.

ich nur lieber verwenden Javascript und nicht JQuery

Answer 1

Einfache Tippfehler in Ihrem Code sollte innertextinnerText

var i; 
 
var button = document.getElementsByClassName("flatbutton"); 
 
for (i = 0; i < button.length; ++i) { 
 
    if (button[i].type == "submit") { 
 
    console.log(button[i].innerText); 
 
    } 
 
}

<button type="submit" class="flatbutton">Send</button>

Answer 2

ändern innertext zu innerText sein. Sie erhalten das gewünschte Ergebnis.

Answer 3

Wenn Sie ein einzelnes Klassenelement besser erhalten möchten, vermeiden Sie Schleifen. benutze das. Wenn Sie mehr als eine Klasse haben, verwenden Sie Schleifen.

<button type="submit" class="flatbutton">Send</button> 
var button = document.getElementsByClassName("flatbutton")[0].innerText; 
console.log(button); 

Answer 4

Man könnte es in jQuery wie folgt tun:

$(".flatbutton[type='submit']").each(function() 
{ 
    console.log($(this).html()); 
}); 

Oder Sie einfach alles komplizierter machen von Vanille JS mit:

var btns = document.getElementsByClassName("flatbutton"); 
for(var i=0;i<btns.length;i++) 
{ 
    var btn=btns[i]; 
    if(btns.getAttribute("type") == "submit") 
    { 
     console.log(btn.innerHTML); 
    } 
} 

Answer 5

Statt

Konsole .log (Knopf [i] .Innertext);

Verwenden

console.log (Taste [i] .textContent);

Answer 6

Sie können ein Datenattribut für die Schaltfläche festlegen und den Wert von dort abrufen. so.

<button type="submit" class="flatbutton" data-value="send" >Send</button> 

var buttonvalue = document.getElementsByClassName("flatbutton").data.value; 

Warum nicht von JQUERY? Oder Sie können versuchen, den "send" -Wert zu holen, indem Sie .value wie folgt ausprobieren.

 var i; 
     var button = document.getElementsByClassName("flatbutton"); 
     for (i = 0; i < button.length; ++i) { 
     if (button[i].type == "submit") { 
     console.log(button[i].value); 
     } 
     }