JavascriptまたはCSSのいずれかでタスクを実行できる場合、CSSを使用する方が良いでしょうか？[閉まっている]

私は常に可能な限りCSSを使用してJavaScriptを拒否しています。

つまり、JavaScriptではなくCSSを使用してタブとロールオーバーボタンを作成します。

JavaScriptを提唱するいくつかのソリューション、特にWt Webフレームワークを見てきました。ただし、ブラウザが対応していない/ jsが無効になっている場合は、CSSに正常にダウングレードします。

CSSとJavaScriptには異なる目的があることは知っていますが、重複しています。これがこの質問のボーンです。

JavaScriptを使用してできるだけCSSを使用し続ける必要がありますか？

はい。

CSSの目的は、レイアウト、ルックアンドフィール、およびアニメーションです

JavaScriptの目的は相互作用です。

レイアウトを行う場合はCSSを使用し、ルックアンドフィールを設定する場合はCSSを使用し、アニメーションを行う場合はCSS3を使用します

イベントハンドラをアタッチするか、ユーザー入力に反応する場合は、JavaScriptを使用します。

ブラウザのサポートにCSSではなくJavaScriptを使用していることに注意してください。JavaScriptを使用してCSS機能をエミュレートするような他のソリューションがあります。

まあ、それは実際にはかなり興味深い質問です。特に、ほとんどの場合、CSSもJavaScriptもWebページ上で実際に計算を集中的に行うことはないので、このようなベンチマークをどのように行うのかを考えています。

私の直感では、可能な限りCSSを使用すると言いますが、それを厳しくて速いルールにしないでください。

a:hover {
  background-color: green;
}

意味的には

$('a').onmouseover(function() {
  $(this).css('background-color','green');
})

だが

$('a').onmouseover(function() {
  if (somethingelsehappened) {
    $(this).css('background-color','green');
  }
})

CSSでは難しい（不可能ではないが）。この方法でできます。

$('a').onmouseover(function() {
  if (somethingelsehappened) {
    $(this).addClass('Green');
  }
})

a.green {
  background-color: green;
}

これは、JavaScriptで直接行うことができる方法を実際に行うには少し厄介な方法ですが、私はそれを数分間考えていましたが、ここでさえ、正しいソリューションはCSSホバーを行うときに多くの属性を設定していた場合。

**このコードはどれも動作しないことが予想されます。これらはデモのみを目的としています。**

Yahoo Developer Networkから次のことを検討してください。

「数値を処理した後、実際の訪問者トラフィックの約1％でJavaScriptが無効化されたリクエストの一貫した割合が見つかりました。最高率は米国で約2％、最低率はブラジルで約0.25％です。テストした他の国では、1.3パーセントに非常に近い数値を示しました。」

パーセンテージが非常に低い（最大）ので（ユーザーが主にその2％から来ない限り）、ユーザーがjavascriptをオフにしている場合を心配する価値はほとんどありません。平均的なユーザーは、javascriptをオフにする方法を知らず、おそらく気にしません。ハイテクWebサイトを開発している場合、JavaScriptを無効にしている可能性を検討する必要がありますが、多くのWebサイトがJavaScriptを頻繁に使用するため、正しく機能しないWebサイトに慣れている可能性があります。

言われたことはすべて、javascriptの開発が私が達成しようとしていることをはるかに簡単にする多くのケースと、cssが同じことをする他のケースを見つけました。

最終的に、各「言語」はWeb開発において適切な位置を占め、賢明に使用することで開発とユーザーエクスペリエンスの両方を強化できます。それらの用途が何であるかを学び（経験学習をお勧めします）、賢明に適用してください。私の経験では、「CSSソリューションが存在する場合にJSを使用しない」（言い換え）などの具体的なルールは、実際の世界ではめったに最適ではありません。

JavaScriptは実際のコンピューター言語です。つまり、プログラム実行の状態と制御を備えています。そのため、取得できる複雑さの上限はなく、その中に記述したものはすべて、実質的に最低限の複雑さを持つことになります。CSSは記述的なコードです。その複雑さは、レシピが持つことができる複雑さのレベルに制限されています。したがって、CSSとJavaScriptの両方で何かを実行できる場合は、CSSを使用します。CSSはそれほど複雑ではないためです。

Javascriptはスクリプト言語です。つまり、何らかのロジックを追加する機能があります。CSSは、ドキュメントの外観とスタイルを記述するために使用されます。主に、ドキュメントの構造を書式設定とレイアウト（プレゼンテーション）から分離するために設計されました。

JavaScriptを使用してWebページの外観を変更できますが、CSSはそれを行うことを目的としていたため、サイトスタイルにはCSSを使用し、残りはJavascriptに任せます。

ウィキペディア：

Javascriptの使用：

• 新しいウィンドウのサイズ、位置、および属性（たとえば、メニュー、ツールバーなどが表示されるかどうか）をプログラムで制御して、新しいウィンドウを開くまたはポップアップします。
• Webフォームの入力値を検証して、サーバーに送信する前に受け入れられることを確認します。
• マウスカーソルが画像上を移動するときに画像を変更する：この効果は、グラフィック要素として表示される重要なリンクにユーザーの注意を引くためによく使用されます。

更新。3番目の点に関して、W3CはCSSについて次のように述べています。

:hover擬似クラスは、ユーザがポインティングデバイスで要素を指定しながら適用し、必ずしもそれを活性化しません。たとえば、ビジュアルユーザーエージェントは、カーソル（マウスポインター）が要素によって生成されたボックスの上に移動したときに、この擬似クラスを適用できます。

CSSの使用：

CSS以前は、HTMLドキュメントのプレゼンテーション属性のほとんどすべてがHTMLマークアップ内に含まれていました。すべてのフォントの色、背景スタイル、要素の配置、境界線およびサイズは、HTML内で頻繁に繰り返し記述される必要がありました。CSSを使用すると、作成者はその情報の多くを別のスタイルシートに移動して、HTMLマークアップを大幅に簡素化できます。