同じ質問が本家にありますね。
大分古いですが。
Javascript isDOM — How do you check if a Javascript Object is a DOM Object?
完全な回答はリンク先を参照していただくとして(回答そのものはそんなに長くありません)、前半だけ引用します
function isElement(obj) {
try {
//Using W3 DOM2 (works for FF, Opera and Chrom)
return obj instanceof HTMLElement;
}
catch(e){
//Browsers not supporting W3 DOM2 don't have HTMLElement and
//an exception is thrown and we end up here. Testing some
//properties that all elements have. (works on IE7)
return (typeof obj==="object") &&
(obj.nodeType===1) && (typeof obj.style === "object") &&
(typeof obj.ownerDocument ==="object");
}
}
obj instanceof HTMLElement
で確認できる場合はそれを利用し、
そうでない場合は、
- そのオブジェクトのデータ型が "object"
- nodeTypeが 1 (
ELEMENT_NODE
)
- styleプロパティのデータ型が "object "
- ownerDocumentプロパティのデータ型が "object"
以上すべてを満たせば、関係性からHTMLElementでしょうと判断しています。
別の回答でフレームワークの機能を使って確認するというのもあるようです。
ただ気を付けて欲しいのが、たとえばjQueryなどフレームワークがラップしているオブジェクトは条件にあてはめられるとは限りません(多くの場合当てはまりません)。
たとえばChromeで、
<div id="hoge"></div>
があったとして
var x = document.getElementById("hoge");
if(x instanceof HTMLElement) Console.log("true");
if(typeof x.style === "object") Console.log("true");
どちらもtrueと出力されますが、
var jqx = $("#hoge");
if (jqx instanceof HTMLElement) Console.log("true");
if (typeof jqx.style === "object") Console.log("true");
はどちらも出力されません。
以下ならtrueと出力されます。
if (jqx[0] instanceof HTMLElement) Console.log("true");
if (typeof jqx[0].style === "object") Console.log("true");
DOM要素
という言葉でどの範囲を想像しているかわかりませんが、フレームワークを使っている場合は気を付けてください。