headjs は Web サイトの並列読み込みを実装しますが、JS は順次実行します

JS を並行してロードしますが、ウェブサイトの速度を向上させるために順番に実行してください

<script src="js/head.min.js"></script>
<script type="text/javascript"> head.js("js/jquery-1.6.1.min.js","js/jquery.validate.min.js","js/my_validate.js"); </script>

注: head.js("js/jquery-1.6.1.min.js","js/jquery.validate .min .js","js/my_validate.js"); それに含まれる JS はローカル フォルダーにある必要があり、そうでない場合は IE の途中で実行されます

例: head.js("js/jquery-1.6 .1.min .js","js/jquery.validate.min.js","js/alert.js"); ローカルに jquery.validate.min.js ファイルがない場合、alert.js は実行されませんIE

1 で、Jquery などの他の JS ファイルを非同期的に読み込みます。以前は参照する外部 JS をページの下部に配置していましたが、head.js を使用した後は、すべての JS コンテンツを 1 つのファイルにまとめてページの最後に配置できます。その後、この JS ファイル内で他の外部 JS を参照できます。たとえば、ページの下部に参照される JS があります。内容は次のとおりです。

head(function() {
........
});
/* part 1 */
head.js("http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js");
/* part 2 */

最初の部分はページのロード後に実行される JS スクリプトで、2 番目の部分は次のアドレスです。スクリプトを実行する前に参照される外部 JS ファイル。使用している Jquery バージョンをアップグレードする場合は、ページのコンテンツを変更せずにこのファイルを変更するだけで済みます。これは、静的に公開される MovableType に役立ちます。

2. CSS3 属性の検出をサポートします。これは口では言えませんが、ブラウザが特定の CSS3 プロパティをサポートしているかどうかを知ることができることを意味します。特定の属性がサポートされている場合、この属性にちなんで名付けられたクラスがページの HTML ノードに追加されます。サポートされていない場合、クラス名には no- プレフィックスが付きます。たとえば、IE6 は boxshadow 属性をサポートしていないため、IE6 を使用してページを参照すると、ページの html ノードは のようになります。

このようにして、ブラウザが特定の高度な属性をサポートしていない場合に、代わりに他のソリューションが使用されるように CSS ファイルで設定できます。

.boxshadow .box{
box-shadow: 0px 0px 5px #bbb;
}
.no-boxshadow .box{
border: 2px solid #bbb;
}

現在、head.js が検出できる CSS3 プロパティには、borderimage、borderradius、boxshadow、不透明度、反射、rgba、textshadow、transitions が含まれます。

3. head.js はブラウザの種類とバージョンを検出でき、さらに素晴らしいことに、head.js は現在のウィンドウ サイズを動的に検出できます。ブラウザの。さらに、前の属性を HTML ノードに動的に渡し、対応するクラスを追加します。このように CSS と組み合わせることで、各ブラウザに適応し、各ページをユニークにし、ウィンドウ サイズの変化に応じてレイアウトを自動的に変更するクールなデザインを作成できます。