9
4

2 に答える 2

10

ああ、JavaScript のすばらしい混乱の世界。あなたが投稿したコードは、ほとんどのプログラマーが考えていることをおそらく実行しません。

次の各行には違いがあります。

<a onclick="alert('Hello World!')"...>example</a> //V1
<a href="javascript: alert('Hello World!')"...>example</a> //V2
<a onclick="javascript: alert('Hello World')"...>example</a> //V3

それらはすべて警告しますがHello World!。

最初の (V1) には、属性clickを介してバインドされたインラインイベントがあります。[onclick]また[href]、属性が実行された後に別の場所に移動する属性、またはデフォルトの動作が妨げられていないと仮定して、コードにバインドされた[onclick]その他の任意の数のイベントを含めることもできます。click

2 番目 (V2) には、実行可能なjavascript:URL が[href]属性として設定されています。また、外部スクリプトにバインドされた[onclick]属性またはその他のイベントが含まれる場合もあります。click

1 番目と 2 番目の例 (V1 と V2) では、次のような同一のコードが実行されています。

alert('Hello World!')

3 番目の例 (V3) には、V1 と同様に属性clickを介してバインドされたインライン イベントがありますが、実行されるコードは異なります。実行されたコードは次のとおりです。[onclick]

javascript: alert('Hello World')

URLのように見えますが、javascript:実際には JavaScript でラベルを使用しているだけです。

JavaScript のラベルは、次のコード例のように、ネストされたループをスキップするのに役立ちます。

label: for (i = 0; i < 5; i++) { //labeled line
    for (j = 0; j < 5; j++) {
        console.log(i, j);
        if (i === 2 && j === 3) {
            break label; //this jumps out of both for loops
        }
    }
}

ほとんどのインライン JavaScript では、作成者が 3 つの形式の違いを理解していないため、誤用されています。

使い方が悪いのはなぜjavascript: <code>？

それは主要な質問です。使い方javascript: <code> が悪いとします。

javascript: <code> 悪くないです。それはツールです。ツールに本質的な良し悪しはありません。ツールを使用する人だけがそうです。誰かがそれを武器として使ったとしても、ハンマーを「悪い」とは呼ばないでしょう。

javascript: <code>いくつかの良い用途があります。ほとんどの場合、これは仕事に適したツールではないため使用しないでください。ただし、ブックマークレットを作成している場合は、この形式を使用する必要javascript: <code>があります。

さらに、JavaScript をインラインのままにしておくことが理にかなっているニッチなコンテキストがいくつかあります。この例はprint、ページに単純なボタンを追加することです。

<a href="#" onclick="window.print(); return false">Print</a>

この例でさえ、クラスに簡単に置き換えて、javascript を外部化することができます。

<a href="#" class="print">Print</a>
<script>
     //jQuery used for brevity
     $(document).on('click', '.print', function () {
         window.print();
         return false;
     });
</script>
于 2012-07-25T18:20:29.390 に答える
2

javascript:ラベルの使用に問題はありません。ほとんどの場合、スタイルが悪いと見なされます。

  • -handleronclickは既に JavaScript であるため、これを繰り返すのは無意味で冗長な情報です (実際、named というラベルを追加して実行されるコードを変更していますjavascriptが、ほとんどの場合、これは何の効果もありません)。
  • 属性内の JavaScript コードはハンドラーhref内により適切に配置されるため、 を使用して、JavaScript が無効になっているユーザーにリンクを提供できます。これはプログレッシブ エンハンスメントと呼ばれます。onclickhref

詳細については、「役に立たない JavaScript: 疑似プロトコル」に関するこの素晴らしいブログ投稿をご覧ください。

于 2012-07-25T18:15:12.723 に答える