📜  如何使用 JavaScript 加载 CSS 文件?

📅  最后修改于: 2021-11-07 09:21:19             🧑  作者: Mango

CSS 文件用于描述 HTML 元素的显示方式。有多种方法可以在 HTML 文档中添加 CSS 文件。 JavaScript 也可用于在 HTML 文档中加载 CSS 文件。

方法:

  • 使用 document.getElementsByTagName() 方法获取 HTML 头部元素。
  • 使用 createElement(‘link’) 方法创建新的链接元素。
  • 初始化链接元素的属性。
  • 将链接元素附加到头部。

示例 1:本示例使用 JavaScript 在 HTML 文档中添加 CSS 文件。

  • 使用名称 style.css 创建 CSS 文件:
    .GFG {
        color:green;
    }
    
  • 使用 JavaScript 添加 CSS 文件:
    
    
      
    
        
            Load CSS file using JavaScript
        
      
         
    
      
    
        

    GeeksForGeeks

                           

输出:

示例 2:本示例使用 JavaScript 在 HTML 文档中添加 CSS 文件。

  • 使用名称 style.css 创建 CSS 文件:
    .GFG {
        font-size:24px;
        font-weight:bold;
        color:white;
        background-color:green;
        padding:10px;
        text-align:center;
    }
    
  • 使用 JavaScript 添加 CSS 文件:
    
    
      
    
        
            Load CSS file using JavaScript
        
      
         
    
      
    
        
    GeeksforGeeks
                           

输出:

HTML 是网页的基础,用于通过构建网站和 Web 应用程序进行网页开发。您可以按照此 HTML 教程和 HTML 示例从头开始学习 HTML。

CSS 是网页的基础,用于通过样式化网站和 Web 应用程序进行网页开发。您可以按照此 CSS 教程和 CSS 示例从头开始学习 CSS。