ホームページ >ウェブフロントエンド >jsチュートリアル >js css風操作コード(バッチ操作)_javascriptスキル

js css風操作コード(バッチ操作)_javascriptスキル

WBOY
WBOYオリジナル
2016-05-16 18:45:09992ブラウズ

js を使用して CSS スタイルを記述する場合、通常は次の 2 つの方法を使用します:

一般に、js を使用して要素オブジェクトのスタイルを設定する場合は、次の形式を使用します:

コードをコピーします コードは次のとおりです。

var element= document.getElementById(”id”); .style.width=”20px” ;
element.style.height=”20px”;
element.style.border=”solid 1px red”;

欠点は、スタイルが多すぎることです。JS を介してオブジェクトのスタイルを上書きすることは、通常、元のスタイルを破壊して再構築するプロセスであり、ブラウザのオーバーヘッドが増加します。

js には cssText メソッドがあります:
構文は次のとおりです: obj.style.cssText("style");
上記のコードは次のように変更できます:

コードをコピー コードは次のとおりです:
element.style.cssText=”width:20px;height:20px;border :solid 1px red ;";

この書き込み方法により、ページの複数のリフローを回避し、ページのパフォーマンスを向上させることができます。
声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。