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


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');
}

Antworten:


118

Etwas wie das:

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

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

44

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

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

20

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)


9

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


Guter Weg für TypeScript!
25лья Зеленько

4
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


1
Nee. $(this).tagNameist einfach falsch. Du meinst$(this).attr('tagName')
Marco Faustinelli

3

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.


2

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");
  }
});

1

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


1

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');



0
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 */
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.