📌  相关文章
📜  如何使用 jQuery 从特定页面中删除全局 CSS 文件?

📅  最后修改于: 2021-10-28 03:18:01             🧑  作者: Mango

本文介绍了从页面中删除全局 CSS 文件的方法。它可用于模板可能包含全局 CSS 文件并且您需要删除该文件以使任何其他 CSS 文件生效的场景。我们将在下面的示例中看到这一点:

考虑带有两个 CSS 文件导入的 index.html 文件, global.css one 的id和id为 two 的第二个page.cssglobal.css是保留在所有页面中的文件,而page.css是特定页面的文件。

下面的代码用于index.html文件。 global.css 和 page.css 文件都包含在演示中。

HTML


  

    
    
  
    

  

    

GeeksForGeeks

    

Welcome to GeeksForGeeks

       
        

            A Computer Science portal for geeks.              It contains well written, well              thought and well explained computer              science and programming articles,              quizzes and questions. A Computer              Science portal for geeks. It contains              well written, well thought and well              explained computer science and              programming articles, quizzes and              questions.         

    
       
        

            A Computer Science portal for geeks.              It contains well written, well              thought and well explained computer              science and programming articles,              quizzes and questions. A Computer              Science portal for geeks. It contains              well written, well thought and well              explained computer science and              programming articles, quizzes and              questions.         

    
  


jQuery


HTML


  

    
    
  
    
  
    
    
  
    

  

    

GeeksForGeeks

    

Welcome to GeeksForGeeks

       
        

            A Computer Science portal for geeks.              It contains well written, well              thought and well explained computer              science and programming articles,              quizzes and questions. A Computer              Science portal for geeks. It contains              well written, well thought and well              explained computer science and              programming articles, quizzes and              questions.         

    
       
        

            A Computer Science portal for geeks.              It contains well written, well              thought and well explained computer              science and programming articles,              quizzes and questions. A Computer              Science portal for geeks. It contains              well written, well thought and well              explained computer science and              programming articles, quizzes and              questions.         

    
  


CSS 文件: global.css 文件

p {
    color: red;
    text-align: center;
}

h3 {
    color: chocolate;
    text-align: center;
}

body {
    background-color: rgb(178, 248, 248);
}

下面的代码是page.css文件。

h1 {
    color: green;
    text-align: center;
}

h2 {
    text-align: center;
}

p {
    color: magenta;
}

输出:这是带有 global.css 和 page.css 文件的 Index.html。

方法:我们将创建一个脚本,该脚本将找到 id 为“one”的全局样式表,并将其从 head 部分中删除。 jQuery 的find()remove()方法用于此目的。下面给出的示例演示了这一点:

jQuery


最终代码:

HTML



  

    
    
  
    
  
    
    
  
    

  

    

GeeksForGeeks

    

Welcome to GeeksForGeeks

       
        

            A Computer Science portal for geeks.              It contains well written, well              thought and well explained computer              science and programming articles,              quizzes and questions. A Computer              Science portal for geeks. It contains              well written, well thought and well              explained computer science and              programming articles, quizzes and              questions.         

    
       
        

            A Computer Science portal for geeks.              It contains well written, well              thought and well explained computer              science and programming articles,              quizzes and questions. A Computer              Science portal for geeks. It contains              well written, well thought and well              explained computer science and              programming articles, quizzes and              questions.         

    
  

输出:这是 global.css 删除后的索引页面。