「document.getElementByClassは関数ではありません」

onclickで任意のボタンの機能を実行しようとしていますclass="stopMusic"。Firebugでエラーが発生する

document.getElementByClassは関数ではありません

これが私のコードです：

var stopMusicExt = document.getElementByClass("stopButton");
    stopButton.onclick = function() {
        var ta = document.getElementByClass("stopButton");
        document['player'].stopMusicExt(ta.value);
        ta.value = "";
    };

あなたはおそらく意味しましたdocument.getElementsByClassName()（そして結果のノードリストから最初のアイテムをつかみます）：

var stopMusicExt = document.getElementsByClassName("stopButton")[0];

stopButton.onclick = function() {
    var ta = document.getElementsByClassName("stopButton")[0];
    document['player'].stopMusicExt(ta.value);
    ta.value = "";
};

それでもエラーが発生する場合があります

document.getElementsByClassName 関数ではありません

ただし、古いブラウザでは、古いブラウザをサポートする必要がある場合は、フォールバック実装を提供できます。

他の人が言ったように、あなたは正しい関数名を使用しておらず、すべてのブラウザで普遍的に存在するわけではありません。

with withを持つ要素以外のものをクロスブラウザーでフェッチする必要がある場合は、document.getElementById()すべてのブラウザーでCSS3セレクターをサポートするライブラリーを入手することを強くお勧めします。これにより、開発時間、テスト、およびバグ修正が大幅に削減されます。jQueryは非常に広く利用可能で、優れたドキュメントがあり、無料のCDNアクセスがあり、質問に答えるための優れたコミュニティーがあるため、jQueryを使用するのが最も簡単です。それが必要以上に思える場合は、単なるセレクターライブラリであるSizzleを取得できます（実際には、jQueryなどの内部のセレクターエンジンです）。私はそれを他のプロジェクトで単独で使用しており、それは簡単で、生産的で、小さいです。

一度に複数のノードを選択する場合は、さまざまな方法で行うことができます。それらすべてに同じクラスを与えると、次のようにできます。

var list = document.getElementsByClassName("myButton");
for (var i = 0; i < list.length; i++) {
    // list[i] is a node with the desired class name
}

そして、そのクラス名を持つノードのリストを返します。

シズルでは、これは次のようになります：

var list = Sizzle(".myButton");
for (var i = 0; i < list.length; i++) {
    // list[i] is a node with the desired class name
}

jQueryでは、次のようになります。

$(".myButton").each(function(index, element) {
    // element is a node with the desired class name
});

SizzleとjQueryの両方で、次のように複数のクラス名をセレクターに入れて、はるかに複雑で強力なセレクターを使用できます。

$(".myButton, .myInput, .homepage.gallery, #submitButton").each(function(index, element) {
    // element is a node that matches the selector
});

さらにエラーチェックを行う前に、まず、

document.getElement s ByClassName（）自体。

そのgetElementダブルチェック秒 getElementをしていません

であるべきでありgetElementsByClassName、そうではないgetElementByClass。これを参照してください-https://developer.mozilla.org/en/DOM/document.getElementsByClassName。

一部のブラウザ/バージョンはこれをサポートしていない場合があることに注意してください。

document.querySelectorAll かなりうまく機能し、選択をさらに絞り込むことができます。

https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelectorAll

スペルを間違えた場合、「getElementsByClassName」のはずです。

var objs = document.getElementsByClassName("stopButton");
var stopMusicExt = objs[0]; //retrieve the first node in the stack

//your remaining function goes down here.. 
document['player'].stopMusicExt(ta.value);
ta.value = "";

document.getElementsByClassName-CLASS属性は複数のオブジェクトへの割り当てに使用されるため、複数のアイテムを持つノードのスタックを返します...

    enter code here
var stopMusicExt = document.getElementByClass("stopButton").value;
    stopButton.onclick = function() {
        var ta = document.getElementByClass("stopButton");
        document['player'].stopMusicExt(ta.value);
        ta.value = "";
    };


// .value will hold all data from class stopButton

getElementByClassおそらく、あなたが使用したい、存在しませんgetElementsByClassName。ただし、別のアプローチを使用できます（angular / vue / react ...テンプレートで使用）

function stop(ta) {
  console.log(ta.value) // document['player'].stopMusicExt(ta.value);
  ta.value='';
}

<input type="button" onclick="stop(this)" class="stopMusic" value='Stop 1'>
<input type="button" onclick="stop(this)" class="stopMusic" value='Stop 2'>

この「getElementByClassName」を書き込んだ場合、「document.getElementByClassは関数ではありません」というエラーが発生するので、そのエラーを克服するには「getElementsByClassName」とだけ書いてください。それは要素ではなく要素であるべきだからです。