0

最初に非表示にするHTML要素を表示するためのベストプラクティスはどれですか?

  • HTMLで要素を作成し、CSSで非表示にします。使用するときは、JavaScriptで表示してください。
  • 要素が必要な場合は、JavaScriptで作成して表示します。

前者の欠点は、潜在的に不要な要素がHTMLにあり、最初はCSSで非表示にする必要があることです。後者の欠点は、HTMLがJavaScriptファイルに含まれていることです。

編集:例を追加する

1つの例は、読み込みインジケーターの追加やモーダルウィンドウの表示です。

4

2 に答える 2

2

これには、さらに多くの要因が関係しています。リンクや選択リストオプションなどの小さな要素を挿入する場合、JavaScriptでそれらを動的に生成することは問題ではありません。一連の複雑なHTMLを繰り返し生成する場合は、マークアップにhtmlのテンプレートを作成して(Webデザイナーがそれを維持できるように)、CSSでテンプレートを非表示にすることをお勧めします。次に、javascript(jQueryなど)を使用してテンプレートのクローンを作成し、それをDOMに挿入します。これにより、より多くのネイティブ実装を使用して、HTMLを解析する厄介なJavaScriptをすべて使用せずにDOMツリーを拡張できるという利点があります。

しかし、最終的に実用性はこれに帰着します:誰がコードを維持するのでしょうか?よりエレガントな解決策は、メンテナが理解できるものでしょうか?それとも、すべてをjavascriptに入れることで(その優雅さにもかかわらず)、将来必要になったときにジュニアコーダーが拡張または更新できるようになるでしょうか?

Webブラウザーの大部分は、少なくともWebブラウジングに関して、ユーザーが実際に「必要とする」ものに対して途方もなく強力なハードウェアで実行されます。このため、Javascriptの非効率的なソリューションが差し迫った問題になることはめったにありません。ただし、モバイルブラウザをターゲットにしている場合は、効率==バッテリー寿命です。したがって、大量のdom操作を行っている場合は、上記の提案を検討して、それが自分のケースで機能するかどうかを確認してください。

頑張ってください!-ブレンダン

于 2013-01-17T17:31:13.870 に答える
1

その質問への答えは、「必要になるまで作成しないでください」という方向に非常に偏っていました。

その決定の背後にある理由はまだいくらか当てはまりますが、以前ほどではありません。

  • スタイルをオフにしてブラウザを実行しているユーザーには、非表示のコンテンツが表示されます。彼らはまた非常に醜いウェブを見るでしょう。私はそれについて心配しません。
  • スタイルをサポートしていない非常に古いブラウザを実行している人には、それが表示されます。彼らはまた非常に壊れたウェブを見るでしょう。私も気にしない
  • スクリーンリーダーがそれを受け取ります。最新のスクリーンリーダーは、コンテンツが何であるかを理解するのにはるかに優れているようで、表示されません。ADA準拠が必要な場合、または単に責任を負いたい場合は、そこでいくつかのテストが行​​われる可能性があります。
  • 時々、印刷するとき、隠されたコンテンツが拾われるでしょう。繰り返しますが、問題ではありません。

とにかく、コンテンツを動的に追加しようとするのではなく、CSSを介して非表示にするために行います。

于 2013-01-17T17:30:57.417 に答える