返回顶部
首页 > 资讯 > 精选 >js中引入css的方法
  • 823
分享到

js中引入css的方法

2023-06-14 14:06:11 823人浏览 薄情痞子
摘要

这篇文章主要介绍了js中引入CSS的方法,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。js中引入css的方法:1、使用“document.write”方式输出引入css的li

这篇文章主要介绍了js中引入CSS的方法,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。

js中引入css的方法:1、使用“document.write”方式输出引入css的link标签;2、使用createElement方法动态创建link标签来引入css。

本文操作环境:windows7系统、javascript1.8.5版、Dell G3电脑。

js引入css文件

使用document.write方式输出引入css的link标签

在调用文件的顶部加入下例代码

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

使用createElement方法动态创建link标签,来引入css

在将下边代码放入Body中

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

我们来分析一下关键的几句代码:

首先我们利用document.createElement('link')生成了一个link标签;

然后设置其rel属性为stylesheet,href为main.css;

最后将这个标签动态地加入body中。

感谢你能够认真阅读完这篇文章,希望小编分享的“js中引入css的方法”这篇文章对大家有帮助,同时也希望大家多多支持编程网,关注编程网精选频道,更多相关知识等着你来学习!

--结束END--

本文标题: js中引入css的方法

本文链接: https://lsjlt.com/news/271314.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

猜你喜欢
  • js中引入css的方法
    这篇文章主要介绍了js中引入css的方法,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。js中引入css的方法:1、使用“document.write”方式输出引入css的li...
    99+
    2023-06-14
  • HTML中引入CSS的方法有哪些
    这篇文章主要讲解了“HTML中引入CSS的方法有哪些”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“HTML中引入CSS的方法有哪些”吧!行内引入直接在标签中加入 CSS 样式。若使用此方法过...
    99+
    2023-06-27
  • html引入css文件的方法
    这篇文章给大家分享的是有关html引入css文件的方法的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。引入方法:1、使用link标签引入,语法“<link rel="stylesheet"...
    99+
    2023-06-15
  • VUE项目中引入JS文件的方法总结
    目录1.在index.html页面使用script标签引入2.在main.js中使用window.moduleName 使用3.手动添加export4. 使用import方式,把需要...
    99+
    2024-04-02
  • css引入字体文件的方法
    这篇文章主要介绍了css引入字体文件的方法,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。在css中,可以使用“@font-face”规则来引入字体文件,语法格式“@font-...
    99+
    2023-06-06
  • js和css文件如何引入
    小编给大家分享一下js和css文件如何引入,希望大家阅读完这篇文章之后都有所收获,下面让我们一起去探讨吧! 外部样式表 当样式需要应用于很多页面时,外部样式表将是理想的选择。在使用外部样式表的情况下,你...
    99+
    2024-04-02
  • 引入外部css的方法有哪些
    小编给大家分享一下引入外部css的方法有哪些,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧! 引入外部...
    99+
    2024-04-02
  • CSS引入样式的方法有哪些
    本文小编为大家详细介绍“CSS引入样式的方法有哪些”,内容详细,步骤清晰,细节处理妥当,希望这篇“CSS引入样式的方法有哪些”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。   ...
    99+
    2024-04-02
  • vue项目中引入js-base64方式
    目录vue引入js-base641.安装md5依赖2.在需要使用md5的组件中使用直接使用md5使用Base64编码解码1.下载包2.在你需要解码(编码)的文件中引用3.使用方法vu...
    99+
    2024-04-02
  • HTML中引入CSS的方式有哪些
    这篇文章给大家分享的是有关HTML中引入CSS的方式有哪些的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。   一、认识CSS   CSS:层叠样式表(Cascading St...
    99+
    2024-04-02
  • react中引入css的方式是什么
    这篇“react中引入css的方式是什么”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“react中引入css的方式是什么”文...
    99+
    2023-06-30
  • Vue中引入第三方JS库的四种方式
    目录一、绝对路径直接引入,全局可用二、绝对路径直接引入,配置后,import 引入后再使用三、webpack中配置 alias,import 引入后再使用四、webpack 中配置 ...
    99+
    2024-04-02
  • 如何引入CSS的方式
    小编给大家分享一下如何引入CSS的方式,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!(1)内嵌式通过<style>&...
    99+
    2024-04-02
  • web开发中是先引入js还是css文件
    这篇文章主要介绍web开发中是先引入js还是css文件,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完! 先引入css文件,让css样式先加载出来,这样就不会...
    99+
    2024-04-02
  • 网页引入css样式的方法有哪些
    本篇内容介绍了“网页引入css样式的方法有哪些”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!内联式样式表:...
    99+
    2024-04-02
  • css的引入方式有哪些
    这篇文章将为大家详细讲解有关css的引入方式有哪些,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。css的三种引入方式1.行内样式,最直接最简单的一种,直接对HTML标签使用style="&quo...
    99+
    2023-06-14
  • 有哪些引入CSS的方式
    本篇文章给大家分享的是有关有哪些引入CSS的方式,小编觉得挺实用的,因此分享给大家学习,希望大家阅读完这篇文章后可以有所收获,话不多说,跟着小编一起来看看吧。css的全称是什么css的全称是Cascading Style Sheets(层叠...
    99+
    2023-06-08
  • 引入CSS的方式有哪些
    这篇文章主要讲解了“引入CSS的方式有哪些”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“引入CSS的方式有哪些”吧!看到淘宝网页中这样写使用的是import,而很多网站都是使用link,当然...
    99+
    2023-06-08
  • Javascript中导入js文件的方法
    这篇文章主要介绍Javascript中导入js文件的方法,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!为了避免在HTML中显示大量的代码,我们一般选择将js脚本单独放入一个文件中,然后再将js文件导入HTML中,这样...
    99+
    2023-06-14
  • vue引用css的方法
    vue引用css的方法:1、在入口js文件main.js中使用import代码引入css文件;2、在index.html文件中使用link标签引入css;3,在app.vue中使用style标签引入css即可。具体操作步骤:在入口js文件m...
    99+
    2024-04-02
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作