我发现一个伟大的
Javascript代码(StackOverflow链接:
How to add a class to body tag?).但是,我无法实现它.
以下是我在测试页上使用的代码:
<!doctype html> <html> <head> <title>Javascript Test</title> <Meta charset="utf-8" /> <script type="text/javascript"> var newClass = window.location.href; newClass = newClass.match(/\/[^\/]+(_|\.)[^\/]+$/); $(document.body).addClass(newClass); </script> </head> <body> </body> </html>
然而,我没有看到任何类添加到body标签结果. (在Safari中查看源码,Chrome)我已经测试过和没有jQuery.
你看到代码有什么问题吗?
我正在使用Behance ProSite.我可以创建多个画廊,但每个画廊将具有相同的背景,因为它们使用相同的模板.我需要为body标签添加一个唯一的类,所以我可以使用不同的CSS背景属性来定位每个类.
解决方法
这段代码有一些小问题:
>确保匹配中的正则表达式实际匹配您的URL模式.我认为Behance Prosites会使用/ 1234 / section和/ 1234/5678 / section / item等URL格式.
> match函数返回一个数组,所以你不能直接将newClass传递给addClass.你需要传递一个数组项,像newClass [0].
>由于您的脚本位于< head>它不能修改< body>因为它在执行时不存在.您需要将脚本移动到页面底部或延迟执行,直到DOM加载完毕.
此片段应适用于Behance Prosites.正则表达式与至少一个非数字字符的URL路径段匹配,以从URL过滤掉/ 1234/5678 /,因此newClass [0]将是上述示例URL中的一部分.
$(document).ready(function() { var path = window.location.pathname; var newClass = path.match(/[^\/]*[^\d\/][^\/]*/); $('body').addClass(newClass[0]); });
祝你好运!