jquery在特定页面上添加css类
我的主要目标是在无序的li中添加一个活跃的类。这是基于用户所基于的特定页面。基本上是一种条件格式。我希望创建一个响应性强的设计，但我目前正在学习MAMP上的jQuery 当前慢方式 HTML 我必须为每一个李加一个班。我希望在页面底部的main.js中这样做。任何帮助都将不胜感激jquery在特定页面上添加css类,jquery,html,css,Jquery,Html,Css,我的主要目标是在无序的li中添加一个活跃的类。这是基于用户所基于的特定页面。基本上是一种条件格式。我希望创建一个响应性强的设计，但我目前正在学习MAMP上的jQuery 当前慢方式 HTML 我必须为每一个李加一个班。我希望在页面底部的main.js中这样做。任何帮助都将不胜感激 更新 这是最终的PHP解决方案。尽管我很想把这个转给Wordpress <nav id="main-site-nav" class="main-menu"> <ul> <li
更新 这是最终的PHP解决方案。尽管我很想把这个转给Wordpress
<nav id="main-site-nav" class="main-menu">
<ul>
<li><a <?php if (strpos($_SERVER['PHP_SELF'], 'index.php')) echo 'class="crnt-page"';?>href="index.php">Home</a></li>
<li><a <?php if (strpos($_SERVER['PHP_SELF'], 'services.php')) echo 'class="crnt-page"';?>href="/services.php">Services</a></li>
<li><a <?php if (strpos($_SERVER['PHP_SELF'], 'certification.php')) echo 'class="crnt-page"';?>href="/certification.php">Certification</a></li>
<li><a <?php if (strpos($_SERVER['PHP_SELF'], 'customers.php')) echo 'class="crnt-page"';?>href="/customers.php">Customers</a></li>
<li><a <?php if (strpos($_SERVER['PHP_SELF'], 'contact-me.php')) echo 'class="crnt-page"';?>href="/contact-me.php">Contact Me</a></li>
</ul>
</nav>
感谢您的快速回复！现在我只需要习惯堆栈溢出中的这个预格式化代码选项：）我建议如下（尽管未经测试）： 尽管在服务器端（当服务器生成页面时）这样做要容易得多 参考资料：
- 最快的方法是在每页的正文中添加一个类，如下所示：
<body class="services">
<li class="services"><a href="..."></a></li>
<li class="certification"><a href="..."></a></li>
这可以通过多种方式实现，不一定是这种方式（特别是如果您的身体上已经有了类），但总体思路是相同的。您可以使用PHP实现这一点 这是PHP的想法
<nav id="main-site-nav" class="main-menu">
<ul>
<li <?php if($_SERVER["SCRIPT_NAME"] == 'index.php') echo 'class="crnt-page"'; ?>><a href="index.php" class="crnt-page">Home</a></li>
<li <?php if($_SERVER["SCRIPT_NAME"] == 'services.php') echo 'class="crnt-page"'; ?>><a href="/services.php">Services</a></li>
<li <?php if($_SERVER["SCRIPT_NAME"] == 'certification.php') echo 'class="crnt-page"'; ?>><a href="/certification.php" >Certification</a></li>
<li <?php if($_SERVER["SCRIPT_NAME"] == 'customers.php') echo 'class="crnt-page"'; ?>><a href="/customers.php">Customers</a></li>
<li <?php if($_SERVER["SCRIPT_NAME"] == 'contact-me.php') echo 'class="crnt-page"'; ?>><a href="/contact-me.php">Contact Me</a></li>
</ul>
</nav>
这对我很有用：
<style>.green {background-color: green;}</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
</head>
<body>
<ul>
<li><a href="bla.html">bla</a></li>
<li><a href="test2.html">test</a></li>
<li><a href="pfff.html">pff</a></li>
<li><a href="bar.html">foo</a></li>
</ul>
<script type="text/javascript">
var url = /\/([^\/]+)$/.exec(document.location.href)[1];
$('a[href="' + url + '"]').addClass('green');
</script>
.green{背景色：绿色；}
var url=/\/（[^\/]+）$/.exec（document.location.href）[1]；
$（'a[href=“”+url+“]”）。addClass（'green'）；
这可能是您正在寻找的，但它是一种PHP方法，而不是javascript（因此在非js浏览器中工作会更好）：不太了解您的问题。你能说得更详细一点吗？尽量不要进入流行语的边缘-响应性设计与jQuery[几乎]没有任何关系，而jQuery肯定与你的服务器环境[MAMP]没有任何关系。我复制了它，并对它进行了更改，它工作了<李>
<li class="services"><a href="..."></a></li>
<li class="certification"><a href="..."></a></li>
$(document).ready(function() {
var bodyClass = $("body").attr("class");
$("li."+bodyClass).find("a").addClass("crnt-page");
});
<nav id="main-site-nav" class="main-menu">
<ul>
<li <?php if($_SERVER["SCRIPT_NAME"] == 'index.php') echo 'class="crnt-page"'; ?>><a href="index.php" class="crnt-page">Home</a></li>
<li <?php if($_SERVER["SCRIPT_NAME"] == 'services.php') echo 'class="crnt-page"'; ?>><a href="/services.php">Services</a></li>
<li <?php if($_SERVER["SCRIPT_NAME"] == 'certification.php') echo 'class="crnt-page"'; ?>><a href="/certification.php" >Certification</a></li>
<li <?php if($_SERVER["SCRIPT_NAME"] == 'customers.php') echo 'class="crnt-page"'; ?>><a href="/customers.php">Customers</a></li>
<li <?php if($_SERVER["SCRIPT_NAME"] == 'contact-me.php') echo 'class="crnt-page"'; ?>><a href="/contact-me.php">Contact Me</a></li>
</ul>
</nav>
<style>.green {background-color: green;}</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
</head>
<body>
<ul>
<li><a href="bla.html">bla</a></li>
<li><a href="test2.html">test</a></li>
<li><a href="pfff.html">pff</a></li>
<li><a href="bar.html">foo</a></li>
</ul>
<script type="text/javascript">
var url = /\/([^\/]+)$/.exec(document.location.href)[1];
$('a[href="' + url + '"]').addClass('green');
</script>