如何使用jQuery将类添加到正文标记？

2023年8月9日 178次阅读

让我澄清一下我的问题,以及我正在寻找的解决方案.我正在使用wikispaces.com,我想使用jQuery动态地为每个页面添加一个独特的body类,以某种方式抓取URL,然后插入将专门应用的唯一body类,仅用于该页面.

所以,这是我的维基空间的一个示例网址…

http://wikithemes.wikispaces.com/Audio+Page

我想让jQuery抓住…让我们说.com /之后的第一个单词,在这个页面上将是音频.所以,我需要的jQuery会将类音频应用到body标签,就像这样……

<body class="audio">

在他们的文档中,任何jQuery都可以插入,因为它默认加载.但他们澄清说,与jQuery中使用的$符号不同,如果你使用jQuery这个词,它只能在wikispaces中工作.像这样…

jQuery(document).ready(function(){

我非常感谢你能帮助我实现这一目标.谢谢！

最佳答案 不确定您在放置代码时的限制.我会把它放在< head>中您的文档并将该类应用于html元素而不是正文,因此您不会获得FOUS或“Flash of Unstyled Content”.几乎在页面加载后,该类在元素上“存在”,但在它显示之前,如果你这样做：

<script type="text/javascript">
    var loc = window.location.pathname.match(/^\/?(\w+)\b/);
    // document.documentElement is the html element, this adds the class
    if(loc) document.documentElement.className += " " + loc[1].toLowerCase();
</script>

如果你真的想使用jQuery：

<script type="text/javascript">
    // jQuery is passed to the ready function as a parameter, so we alias it with $
    // This will work for you even with wikispaces
    jQuery(function($){
        var loc = window.location.pathname.match(/^\/?(\w+)\b/);
        if(loc) $(document.body).addClass(loc[1].toLowerCase());
    });
</script>
点赞