This article describes the approach to remove a global CSS file from a page. It can be used in scenarios where a template might have a global CSS file included and you need to remove the file so that any other CSS file takes effect. We will see this in the example below:
Consider the index.html file with two CSS file imports, the global.css withthe id of “one“ and a second page.css with the id of “two“. The global.css is the file that remains across all pages and page.css is the file for a particular page.
The code below is for the index.html file. Both the global.css and page.css files are included for demonstration.
Output: This is the Index.html with global.css and page.css files.
Approach: We will create a script that will find the global stylesheet with the id of “one” and will remove it from the head section. The find() and remove() methods of jQuery are used for this purpose. This is demonstrated in the example given below:
Please Login to comment...