IEとFirefoxのJavaScriptの7つの書き方まとめ_javascriptスキル-jsチュートリアル-php.cn

IEとFirefoxのJavaScriptの7つの書き方まとめ_javascriptスキル

WBOY

リリース： 2016-05-16 18:46:45

オリジナル

867 人が閲覧しました

この記事では、著者が IE と Firefox の 7 つの異なる JavaScript 構文を紹介します。
1. CSS "float" 値

特定の CSS 値にアクセスするための最も基本的な構文は、キャメルケース表記を使用した
object.style.property
です。値をコネクタに置き換えるには、たとえば、ID「header」を持つ

の背景色の
値にアクセスするには、次の構文を使用します。 ).style.backgroundColor= "#ccc";
ただし、「float」という単語は JavaScript の予約語であるため、
object.style.float
を使用してアクセスできます。 2 つのブラウザでこれを実行します:
IE でこれを記述します:
document.getElementById("header").style.styleFloat = "left";
Firefox でこれを記述します:
document.getElementById (" header").style.cssFloat = "left";

2. 要素 JavaScript では、
object.style.property
構文を使用できます。、外部から CSS スタイルにアクセスして変更するのは便利ですが、これらの構文では既に設定されているインラインスタイル、または JavaScript によって直接設定されたスタイルしか取得できないという制限があります。外部スタイルシートにはアクセスできません。要素の「推論された」スタイルにアクセスするには、次のコードを使用できます。

IE でこれを記述します。
var myObject = document.getElementById("header");
var myStyle = myObject .currentStyle.backgroundColor;
これを Firefox で記述します:
var myObject = document.getElementById("header");
var myComputedStyle = document.defaultView.getComputedStyle(myObject, null); myStyle = myComputedStyle.backgroundColor;

3. 要素の「class」にアクセスします。
「float」と同様に、「class」は JavaScript の予約語です。コンテナでは、次の構文を使用して「クラス」にアクセスします。 IE では次のように記述します。
var myObject = document.getElementById("header");
var myAttribute = myObject.getAttribute("className");
Firefox では次のように記述します。 >var myObject = document.getElementById("header");
var myAttribute = myObject.getAttribute("class");

この構文は、
setAttribute
メソッドを使用した場合にも適用されます。

4. タグの "for" にアクセスする

ポイント 3 で述べたように、にアクセスするには、目に見えない構文の区別も使用する必要があります。 " ラベル内: IE でこれを記述します: var myObject = document.getElementById("myLabel");
var myAttribute = myObject.getAttribute("htmlFor");
Firefox でこれを記述します:
var = document.getElementById("myLabel");
var myAttribute = myObject.getAttribute("for");

5. マウスポインターの位置を取得します。 >マウスポインタの位置を計算することは、あなたにとっては非常に珍しいことかもしれませんが、それが必要な場合、IE と Firefox では構文が異なります。ここに書かれたコードは最も基本的なものであるか、複雑なイベント処理の特定の部分である可能性があります。しかし、それらは類似点と相違点を説明することができます。同時に、IE の結果は Firefox の結果よりも大きく異なること、およびこの方法自体にバグがあることも指摘しなければなりません。通常、この違いは「ドラッグ位置」で補うことができますが、それは別のトピックの記事です :)

IE で次のように記述します:

コピーcode

コードは次のとおりです:var myCursorPosition = [0, 0]; myCursorPosition[0] =event.clientX; [1] = events.clientY;

これを Firefox で記述します:

コードをコピーします

var myCursorPosition = [0, 0]; myCursorPosition[0] =event.pageX; myCursorPosition[1] =even.pageY; 🎜>

6. 表示領域とウィンドウのサイズを取得する
ブラウザの表示位置のサイズを確認する必要がある場合があります。通常、それを「表示領域」と呼びます。」。
IE では次のように記述します。
var myBrowserSize = [0, 0];
myBrowserSize[0] = document.documentElement.clientWidth;
myBrowserSize[1] = document.documentElement.clientHeight; 🎜>Firefox で次のように記述します:
var myBrowserSize = [0, 0];
myBrowserSize[0] = window.innerWidth;

7 . アルファ透明度
まあ、これは JavaScript の構文の問題ではなく、CSS から派生したアルファ透明度です。ただし、オブジェクトをフェードイン/フェードアウトする必要がある場合、これを実行するには、通常はループ内で CSS のアルファ透明度設定にアクセスする必要があります。変更する必要がある JavaScript コードは次のとおりです。
IE でこれを記述します: #myElement { filter: alpha(opacity=50) }
Firefox でこれを記述します:
# myElement { opacity : 0.5; }
これを IE で記述します:
var myObject = document.getElementById("myElement");
myObject.style.filter = "alpha(opacity=80)"; Firefox の場合:
var myObject = document.getElementById("myElement"); myObject.style.opacity = "0.5";
他に何か違う点はありますか?

これは作者によってコンパイルされています。 (経由: Firefox と IE 間の 7 JavaScript の違い) 彼自身の経験に基づいており、sofish はまだ JavaScript の初心者です。さらに違いがある場合は、問題を取り上げて共有し、一緒に学んでください。