ホームページ  >  記事  >  ウェブフロントエンド  >  jsにcssを導入する方法

jsにcssを導入する方法

藏色散人
藏色散人オリジナル
2021-04-19 09:51:258163ブラウズ

jsにcssを導入する方法: 1.「document.write」メソッドを使用してcssを導入するリンクタグを出力します; 2.createElementメソッドを使用して動的にcssを導入するリンクタグを作成します。

jsにcssを導入する方法

この記事の動作環境: Windows7 システム、JavaScript バージョン 1.8.5、Dell G3 コンピューター。

js imports css files

1. document.write メソッドを使用して、css をインポートするリンク タグを出力します。

次のサンプル コードを次の場所に追加します。呼び出し元ファイルの先頭

<script>
    document.write(&#39;<link rel="stylesheet" href="main.css">&#39;);
</script>

2. createElement メソッドを使用してリンク タグを動的に作成し、css を導入します

次のコードを Body に挿入します

<script>
    new_element = document.createElement(&#39;link&#39;);
    new_element.setAttribute(&#39;rel&#39;, &#39;stylesheet&#39;);
    new_element.setAttribute(&#39;href&#39;, &#39;main.css&#39;);
    document.body.appendChild(new_element);
</script>

コードの主要な行 :

最初に document.createElement('link') を使用してリンク タグを生成します;

次に、その rel 属性を stylesheet に設定し、href を main.css に設定します;

最後に、このタグが本文に動的に追加されます。

【推奨学習: JavaScript 上級チュートリアル

以上がjsにcssを導入する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。