javascript - 如何在特定情况下使用 JavaScript 加载特定的 css 文件？

Question

我想:

// Display loader spinner
// Check if ID or Class exist in HTML Page
// If ID or Class are found, load a specific css file
// Display HTML PAGE

这可能吗？

Answer 1

在 JavaScript 中，这是检查页面中是否存在类的方法:

var isClassExist = document.getElementsByClassName('yourClass');
if (isClassExist .length > 0) {
    // elements with class "yourClass" exist
}

这就是将 css 文件附加到页面的方式:

var cssId = 'myCss';  // you could encode the css path itself to generate id..
if (!document.getElementById(cssId))
{
    var head  = document.getElementsByTagName('head')[0];
    var link  = document.createElement('link');
    link.id   = cssId;
    link.rel  = 'stylesheet';
    link.type = 'text/css';
    link.href = 'http://website.com/css/stylesheet.css';
    link.media = 'all';
    head.appendChild(link);
}

加载器部分:

您首先必须在 html 中包含您的微调器:

<div id="dvReqSpinner" style="display: none;">
    <br />
    <center><img src="~/images/loading_spinner.gif" /></center>
    <br />
</div>

然后在 JavaScript 中(使用 jQuery):

$("#dvReqSpinner").hide();