Adakah cara untuk menguji jenis elemen di JavaScript?

Jawabannya mungkin atau mungkin tidak memerlukan pustaka prototipe, namun penataan berikut ini menggunakan pustaka.

function(event) {
  var element = event.element();
  // if the element is an anchor
  ...
  // if the element is a td
  ...
}

Anda bisa menggunakan typeof(N)untuk mendapatkan tipe objek sebenarnya, tetapi yang ingin Anda lakukan adalah memeriksa tag, bukan tipe elemen DOM.

Dalam hal ini, gunakan properti elem.tagNameatau elem.nodeName.

jika Anda ingin menjadi benar-benar kreatif, Anda dapat menggunakan kamus tagnames dan penutupan anonim sebagai gantinya jika switch atau if / else.

if (element.nodeName == "A") {
 ...
} else if (element.nodeName == "TD") {
 ...
}

Mungkin Anda harus memeriksa nodetype juga:

if(element.nodeType == 1){//element of type html-object/tag
  if(element.tagName=="a"){
    //this is an a-element
  }
  if(element.tagName=="div"){
    //this is a div-element
  }
}

Edit: Memperbaiki nilai nodeType

roenving benar TAPI Anda perlu mengubah tes menjadi:

if (element.nodeType == 1) {
//kode
}

karena nodeType 3 sebenarnya adalah node teks dan nodeType 1 adalah elemen HTML. Lihat http://www.w3schools.com/Dom/dom_nodetype.asp

Saya biasanya mendapatkannya dari nilai pengembalian toString (). Ia bekerja di elemen DOM yang diakses berbeda:

var a = document.querySelector('a');

var img = document.createElement('img');

document.body.innerHTML += '<div id="newthing"></div>';
var div = document.getElementById('newthing');

Object.prototype.toString.call(a);    // "[object HTMLAnchorElement]"
Object.prototype.toString.call(img);  // "[object HTMLImageElement]"
Object.prototype.toString.call(div);  // "[object HTMLDivElement]"

Kemudian bagian yang relevan:

Object.prototype.toString.call(...).split(' ')[1].slice(0, -1);

Ia bekerja di Chrome, FF, Opera, Edge, IE9 + (di IE yang lebih lama ia mengembalikan "[Object Object]").

Meskipun jawaban sebelumnya berfungsi dengan sempurna, saya hanya akan menambahkan cara lain di mana elemen juga dapat diklasifikasikan menggunakan antarmuka yang telah mereka terapkan.

Lihat W3 Org untuk antarmuka yang tersedia

console.log(document.querySelector("#anchorelem") instanceof HTMLAnchorElement);
console.log(document.querySelector("#divelem") instanceof HTMLDivElement);
console.log(document.querySelector("#buttonelem") instanceof HTMLButtonElement);
console.log(document.querySelector("#inputelem") instanceof HTMLInputElement);

<a id="anchorelem" href="">Anchor element</a>
<div id="divelem">Div Element</div>
<button id="buttonelem">Button Element</button>
<br><input id="inputelem">

Pemeriksaan antarmuka dapat dilakukan dengan 2 cara sebagai elem instanceof HTMLAnchorElementatau elem.constructor.name == "HTMLAnchorElement", keduanya kembalitrue

Saya memiliki cara lain untuk menguji hal yang sama.

Element.prototype.typeof = "element";
var element = document.body; // any dom element
if (element && element.typeof == "element"){
   return true; 
   // this is a dom element
}
else{
  return false; 
  // this isn't a dom element
}