3

MyFunc()私はそれがと関係していることをするjavascript関数を持っていid="item_for_MyFunc"ます。関数には、

var elem = document.getElementById("item_for_MyFunc");

およびhtml本体には次のものがあります。

<body onload="MyFunc()">
<p id="item_for_MyFunc">

すべてが機能しますが、ページ上のいくつかの項目にこの関数を使用したいと思います。その<p class="item_for_MyFunc">ため、この関数で処理するページで数回使用する必要があるため、idを使用することは解決策ではありません。

関数を変更できるようにするには、関数にどのような変更を加える必要がありますclass="item_for_MyFunc"か？

4

3 に答える 3

5

ですから、そこで行っていることは非常に簡単です。もう少し堅牢なバージョンを紹介します。

document.addEventListener('load', function(){

    var elements = document.querySelectorAll('.myClassName');
    for(var i=0, len=elements.length; i<len; i++){
        MyFunc.call( elements[i] );
    }

}, false);

したがって、IEの古いバージョンである6および7には、querySelectorAllがありません。あなたはそれらについて心配していないと思います。もしそうなら、これを行う他の方法があります、そして私はあなたが必要ならその方法をあなたに示すことができます。

基本的に、すべての要素に「myClassName」のクラスを指定し、querySelectorAllはそれらすべてを検索して、DOM要素の配列を返します。

次に、リストを反復処理し、それらの各要素に対してMyFuncを実行します。

編集 したがって、優れたjavascriptを作成するための重要な原則の1つは、jsコードをhtmlマークアップから可能な限り分離することです。onload="myFunc"のようなインラインイベントハンドラーを使用することはもうほとんどありません。js自体で記述されたイベントハンドラーを使用します。

オプションがある場合は、jQueryライブラリを使用する必要があります。これにより、これらの多くが非常に簡単になり、非常に古いブラウザを強力にサポートし、数十万のWebサイトで使用されます。

于 2012-07-26T07:21:26.127 に答える
4 
document.getElementsByClassName

クラス名を使用してすべてのHTML要素の配列を返します。結果を繰り返し処理すると、設定が完了します。IE <= 8、FF <3を除くすべてのブラウザーでサポートされています。document.querySelectorAllと同じように機能します（IE> = 7、FF> = 3.5で機能します）

互換性チャートについては、 http ： //quirksmode.org/dom/w3c_core.html#gettingelementsを参照してください。

于 2012-07-26T07:17:30.113 に答える
1

あなたは試すことができます：

var elems = document.getElementsByClassName('myClass');

これまで使用したことはありませんが、jQueryを使用するとさらに簡単になります。

var elems = $('.myClass');

于 2012-07-26T07:19:53.520 に答える