javascript - getElementsByClassName - 2012 年に安全に使用できますか?

Question

JavaScriptgetElementByIdを使用しても問題ありません。しかし、どうgetElementsByClassNameですか？それに対するブラウザのサポートはどうですか？

Googleを通じて、このようなさまざまな自家製のソリューションを見つけました

ご覧のとおり、この投稿は現在 4 年前のものです。それとも、利用可能な場合は、そのようなものに jQuery を使用する必要がありますか?

Answer 1

最初に、サポートする必要がある IE のバージョンを正確に特定する必要があります: IE6、IE7、IE8? それを知らずに最適なオプションを提供することはできません。IE9 以上 (一部のモードでは IE8 も) が必要な場合は、document.querySelectorAll(".classname")またはを使用できますdocument.getElementsByClassName("classname")。

他のバージョンの IE が必要な場合は、そのルートに進むことはできません。古いバージョンのIEでサポートを提供するために使用できる30行未満のコードのシムがありますgetElementsByClassName()が、その時点で、すべてのクロスブラウザサポートを行うセレクターライブラリを入手することを強くお勧めしますあなたのために。このようなライブラリを持つ jQuery については、すでにご存知のようです。jQuery の残りの部分が必要ない場合は、セレクター ライブラリのみを入手できます。jQuery は内部で Sizzle を使用していますが、これは単独で使用でき、非常に優れています。他にもあります。

http://caniuse.com/getelementsbyclassnameで、ブラウザーの互換性を自分で調べることができる優れたリソースを次に示します。

Answer 2

使うだけdocument.querySelectorAll(".classname")

IE 8 でサポートされています: http://www.caniuse.com/#search=queryselectorall

---

シムを書きました：

if (typeof document.getElementsByClassName !== 'function') {
    HTMLElement.prototype.getElementsByClassName = function (classname) {
        return this.querySelectorAll('.' + classname);
    };
}

http://jsfiddle.net/P3P5e/1/

(Chrome 21 と Opera 12.50 で [必要に応じて] テストして動作しましたが、Firefox 14 では動作しませんでした。IE を持っていないため、IE で動作するかどうかはわかりません。)

Answer 3

IE 8 ではサポートされていません。