0

私のページでは、div id=questionでidがanswer1であるdivのクラス名を変更したいと思います。どうやってやるの？ありがとう。

$('question1 answer1').addClassName('new_name');

<div id="question1">
   <div id="answer1" class="old_name">
   </div>
</div>

<div id="question2">
   <div id="answer2" class="old_name">
   </div>
</div>
4

2 に答える 2

0

$('answer1')必要なdiv要素への参照を取得するだけです。この$関数は、指定されたID文字列（または何も見つからなかった場合はnull）の要素を返します。使用するときはセレクター文字列を使用しないことに注意してください$。これはIDに対してのみ機能します。

この$$関数はCSSセレクター文字列を受け取り、一致するすべての要素の配列を返します。一致するものがない場合は空の配列を返します。そのルートに行きたい、または行く必要がある場合は、次のように同じdivを見つけることができます。

$$('#question1 .answer1')[0]

上記のメソッドのいずれかを使用して要素参照を取得したら、addClassNameまたはremoveClassNameまたはその他の使用可能な要素メソッドを使用できます。

于 2012-05-26T14:06:44.570 に答える
0

したがって、指摘されているように、セレクターメソッドには何らかのイテレーターが必要であるため、返されるすべてのオブジェクトにメソッドを適用することはできません。ドキュメントでElement.select、これによりオブジェクトを配列に明示的に変換する必要がなくなることになっていることに気付くでしょうが、jsfiddleではこれがうまくいきませんでした。しかし、私は次のことを試みました：

 $('answer2').addClassName('new_name');

そして、それはうまくいきました。問題が（question1 answer1を使用して）元の要素オブジェクトのDOMをトラバースしようとしていることであり、これにはオブジェクト/配列イテレーターが必要なのか、それともコードの他の場所での一時的な中断なのかはわかりません。ただし、特定の例では、クラスを変更する実際の要素のIDがわかっているため、上記のコードは、親要素を指定したり、任意の種類の配列インデックスを使用したりしなくても正常に機能するはずです。

Enumerableオブジェクトと同じメソッド名をElementオブジェクトに使用しているため、prototypejsが私を失望させたことを認めます。そのため、の最初のインスタンスを見て、selectかなり簡単に見えると思いました。ほぼすべてのクラス/メソッドでセレクターを設定して変換するか、手動でトラバースする必要があることを確認したので、これは間違いなく多くのことになると思います。jqueryを使用すると簡単になり、ほとんど同じであるという最初のコメントは、このシナリオでは特に当てはまりません。おそらくprotojsはjqueryが提供しないいくつかの機能を提供します、おそらくあなたのコードはprotojsに関連付けられています（私はYUIを使用しなければならなかったプロジェクトに1年間取り組んでいました、それははるかに大きな悪夢です、私を信じてください）、しかしjqueryは再生するように設定されていますプロトタイプjsとの相性が良いので、このような場合は両方を使用することを検討します。jqueryでは、コードは次のようになります。

jQuery.noConflict();  // Avoids $ fight between jquery and prototypejs
jQuery( '#question1 #answer1' ).addClass('new_name');

または、最初に古いものを削除するには：

jQuery.noConflict();  // Avoids $ fight between jquery and prototypejs
jQuery( '#question1 #answer1' )removeClass('old_name').addClass('new_name');

また、プロトタイプには、おそらく不必要に難解なtoggleClassメソッドがありますが、toggleClassNameを読んでおく必要があります 。

そして、彼らのドキュメントが魅力的である一方で、私が今までで最悪の例を持っていることを除いて、私はこれに私の時間を無駄にすることについてこれほど厄介ではありません（新しいフレームワークを学ぶのに時間がかかることを考えたくないので）見た。それらはすべて、親しみやすい実世界の例や、インスタンスとクラスの違いへのハイパーリンクがなくても、基本的なアイデアがあることを前提としています。2つを区別する例は同じです。私は間違いなく今日の後半に時間を取って、あなたの質問に対する本当の最良の答えを見つけるつもりですが、他に何もないとしても、それが本当に毎回反復する必要がある場合は、vanillajsを使用してください実際に役立つ場合は、このフレームワークを使用してください。

于 2012-05-26T14:19:10.283 に答える