将类添加到html中的脚本行中

Add classes to a Script line in html

本文关键字：脚本 html 添加      更新时间：2024-03-20

我可以使用CSS隐藏脚本行吗？例如，如果我们在脚本行中添加一个class="slider"，如下所示：

<script class="slider" type="text/javascript" src="assets/js/slider.js"></script>

然后在css中我们做了：

.slider {display: none}

我想要这样做的原因是，当一个特定的样式表被称为

时，我想启用js

看看这个相关的问题，找到一种通过JavaScript包含CSS的方法：使用JavaScript动态加载CSS文件，并在没有jQuery 的情况下回调

至少目前，假设您只是在文档加载期间加载样式表。然后，您可以执行以下操作：

function checkLoadedSheetsForHref(href) {
    for (var i = 0; i < document.styleSheets.length; ++i) {
        if (document.styleSheets[i].href == href) {
        // or if you just want to check the filename, check if href contains it:
        // if (document.styleSheets[i].href.indexOf(href) != -1) { 
            return true;
        }
    }
    return false;
}
document.onload = function() {
    if (checkLoadedSheetsForHref("assets/js/slider.js")) {
        // enable whatever js you want
    }
}

如果您有动态加载样式表的东西，您可以设置计时器以等待加载样式表，或者向添加它的任何东西添加onload，或者只检查正在加载的字符串。

我会这么做的。不言自明：

var SliderVar = document.getElementById("slider");
if (SliderVar.style.display == "none") {
    var showScript = false;  
} else {
    var showScript = true;   
}
if(showScript) {
  var sc = document.createElement('script');
  sc.src = 'assets/js/slider.js';
  sc.type = 'text/javascript';
  if(typeof sc['async'] !== 'undefined') {
     sc.async = true;
  }  
  document.getElementsByTagName('head')[0].appendChild(sc);
}
相关文章：