jQuery добавить класс на странице URL

У меня есть то, что я думаю - простой вопрос, но я не могу заставить его работать на жизнь меня.jQuery добавить класс на странице URL

Все, что я хочу сделать, это добавить javascript на страницу, добавляющую класс в контейнер главной страницы на основе URL-адреса.

Скажем, у меня есть сайт на root.com и следующий HTML структуру (грубо говоря):

<html> 
    <head> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 
    </head> 
    <body> 
    <div id="main" class="wrapper"> 
     Blah, blah, blah 
    </body> 
</html>

То, что я хочу сделать, это сценарий, который, если страница = (к примеру) корня .com/technology, он добавляет класс в основной div. Итак, div теперь будет выглядеть так:

 <div id="main" class="wrapper tech">

Я загрузил jquery, так что я хотел бы сделать это таким образом.

источник

2012-04-02 Matt Martin

Вы можете использовать window.location, чтобы получить текущий URL-адрес, а затем переключиться на это:

$(function() { 
    var loc = window.location.href; // returns the full URL 
    if(/technology/.test(loc)) { 
    $('#main').addClass('tech'); 
    } 
});

Это использует регулярное выражение, чтобы узнать, содержит ли URL определенную фразу (в частности: technology), и если это так, добавляет класс в элемент #main.

источник

2012-04-02 20:13:46

Это работает. Благодарю. –

Отлично работает большое спасибо. – 422

@alex vidal Он отлично работает для меня, но он загружается немного позже обычного. Я использую это действие для сохранения подменю, которое открывается после того, как пользователь находится в определенном порядке. Таким образом, пользователь может увидеть через 1-2 секунды, как открывается меню подкатегории. Я хотел бы, чтобы это сделало это мгновенно, как я могу избежать этого? –

Используйте location встроенный объект, чтобы определить полный URL-адрес или некоторые его части.

источник

2012-04-02 20:09:35 kirilloid

Ясно, что это правильно, но это не полностью отвечает на мой вопрос о том, как это сделать. –

что-то вроде ниже поможет? основанный на другой ответ, просто делая

console.log (window.location)

, вы можете богатства богатство информации, относящейся к объекту местоположения

 if(window.location.href=== "root.com/technology") { 
     $("#main").addClass("tech"); 
    }

источник

2012-04-02 20:11:58 DG3

Ну, вот как я бы это сделать:

switch (window.location.pathname) { 
    case '/technology': 
     $('#main').addClass('tech') 
    case '/something': 
    case '/somestuff': 
     $('#main').addClass('some') 
}

Таким образом, вы сохраняете свой код в чистоте, и вы можете легко добавить еще один случай.

См. here, что означает window.location.pathname.

источник

2012-04-02 21:05:54

Мне это нравится, потому что, как вы говорите, вы можете легко добавить еще один случай, не раскалывая вещи. Но я не могу заставить его работать ... –

Мне нравится этот ответ лучше, чем выбранный «лучший» ответ. Операторы Switch более чисты, чем выписывают условные обозначения. – IE5Master

jQuery добавить класс на странице URL

ответ

Смежные вопросы