Как изменить класс CSS на основе параметра строки запроса

Question

У меня есть сайт интрасети сервера SharePoint, на котором отображаются сообщения в блогах, теги которых назначены для помощи в сортировке. SharePoint позволяет динамически сортировать записи блога с помощью строки запроса - поэтому технически URL-адрес страницы остается прежним, и он просто добавляет «? Name = topic» в конец URL-адреса для сортировки сообщений блога.

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

например. Сортировать по:
Видео (www.websitename.aspx? Name = video)

Изображения (www.websitename.aspx? Name = images)

Аудио (www.websitename.aspx? Name = audio)

Я хотел бы оформить заголовки на основе «активного» или выбранного заголовка. Как я могу изменить класс CSS заголовка на «выбранный» на основе параметра строки запроса? (или есть более простой способ сделать это?)

Я все еще изучаю Javascript, поэтому я ищу решение, которое не слишком сложное для реализации.

Спасибо!

Джаред

Answer 1

Вы можете легко получить строку запроса с Javascript:

window.location.search.substring(1);

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

  var queryString = window.location.search.substring(1); 

  switch (queryString) {
    case "video": videoelement.style.background = red;
                   break;

    case "images": imageselement.style.background = red;
                     break;

    case "audio": audioelement.style.background = red;
                     break;
  }