Überprüfen Sie, ob das Element ein div ist

Question 1

Wie kann ich überprüfen , ob $(this)eine ist div, uloder blockquote?

Zum Beispiel:

if ($(this) is a div) {
  alert('its a div!');
} else {
  alert('its not a div! some other stuff');
}

Question 2

Etwas wie das:

if(this.tagName == 'DIV') {
    alert("It's a div!");
} else {
    alert("It's not a div! [some other stuff]");
}

Question 3

Lösungen ohne jQuery sind bereits veröffentlicht, daher werde ich die Lösung mit jQuery veröffentlichen

$(this).is("div,ul,blockquote")

Question 4

Ohne jQuery kann man sagen this.tagName === 'DIV'

Denken Sie daran, dass das 'N' in tagNameGroßbuchstaben geschrieben ist.

Oder mit mehr Tags:

/DIV|UL|BLOCKQUOTE/.test(this.tagName)

Question 5

Um zu überprüfen, ob dieses Element DIV ist

if (this instanceof HTMLDivElement) {
   alert('this is a div');
}

Gleiches gilt für HTMLUListElementUL,
HTMLQuoteElementfür Blockquote

Question 6

if(this.tagName.toLowerCase() == "div"){
    //it's a div
} else {
    //it's not a div
}

edit: während ich schrieb, wurden viele antworten gegeben, sorry für das verdoppeln

Question 7

Durch jQuery können Sie Folgendes verwenden $(this).is('div'):

Überprüfen Sie die aktuell übereinstimmende Gruppe von Elementen anhand eines Selektors, Elements oder jQuery-Objekts und geben Sie true zurück, wenn mindestens eines dieser Elemente mit den angegebenen Argumenten übereinstimmt.

Question 8

Einige dieser Lösungen gehen etwas über Bord. Alles, was Sie brauchen, ist tagNamenormales altes JavaScript. Sie profitieren nicht wirklich davon, wenn Sie das Ganze erneut in jQuery einbinden und insbesondere einige der leistungsstärkeren Funktionen in der Bibliothek ausführen, um den Tag-Namen zu überprüfen. Wenn Sie es auf dieser Seite testen möchten, finden Sie hier ein Beispiel.

$("body > *").each(function() {
  if (this.tagName === "DIV") {
    alert("Yeah, this is a div");
  } else {
    alert("Bummer, this isn't");
  }
});

Question 9

Ich verbessere die Antwort von Andreq Frenkel, wollte nur einige hinzufügen und es wurde zu lang, also hier weg ...

Wenn inputich an CustomElements denke, die die vorhandenen erweitern, und trotzdem prüfen kann, ob ein Element beispielsweise vorhanden ist, denke ich, dass dies instanceofdie beste Lösung für dieses Problem ist.

Man sollte sich jedoch bewusst sein, dass instanceofdie referenzielle Gleichheit verwendet wird, sodass HTMLDivElementein übergeordnetes Fenster nicht mit dem eines seiner iframe(oder Schatten-DOMs usw.) identisch ist .

Um diesen Fall zu behandeln, sollte man die Klassen des eigenen Fensters des überprüften Elements verwenden, etwa:

element instanceof element.ownerDocument.defaultView.HTMLDivElement

Question 10

Alte Frage, aber da keine der Antworten dies erwähnt, könnte eine moderne Alternative ohne Abfrage nur einen CSS-Selektor und Element.matches () verwenden.

element.matches('div, ul, blockquote');

Question 11

Versuchen Sie es mit tagName

Question 12

let myElement =document.getElementById("myElementId");

if(myElement.tagName =="DIV"){

  alert("is a div");

}else{

  alert("is not a div");

}
/*What ever you may need to know the type write it in capitalised letters "OPTIO" ,"PARAGRAPH", "SPAN" AND whatever */

Answer 1

74

Wie kann ich überprüfen , ob $(this)eine ist div, uloder blockquote?

Zum Beispiel:

if ($(this) is a div) {
  alert('its a div!');
} else {
  alert('its not a div! some other stuff');
}

javascript jquery html css James
quelle

Answer 2

118

Etwas wie das:

if(this.tagName == 'DIV') {
    alert("It's a div!");
} else {
    alert("It's not a div! [some other stuff]");
}

Björn
quelle

4

Wussten Sie, dass dies $(this).get(0)gleichbedeutend ist, thisaber ohne Overhead?

Mic

3

@Bjorn Richtig, und keiner ist this. $(this).get(0)Takes this(ein normaler JS-DOM-Knoten) konvertiert ihn in ein jQuery-Objekt, .get(0)wird ausgeführt und wählt den ersten regulären DOM-Knoten innerhalb des jQuery-Objekts aus. Das heißt, Sie gelangen zurück zu Ihrem Ausgangspunkt. this.tagName = $(this)[0].tagName = $(this).get(0).tagName.

Brymck

11

@ Bryan, es ist entsetzlich, wie die Leute in jQuery und nicht mehr in Javascript denken

Mic

@Bjorn: Das funktioniert natürlich nicht. In Ihrem Beispiel übergeben Sie eine Zeichenfolge (Selektor), die in der Antwort thisjedoch bereits ein DOM-Element ist. Versuche es einfach this === $(this).get(0).

Felix Kling

4

Es lohnt sich, daran zu erinnern, .toLowerCase () zu verwenden, falls Javascript zufällig Großbuchstaben zurückgibt, auch wenn die Namen in HTML Kleinbuchstaben sind.

Buffalo

Answer 3

4