Простой способ подсветить блок с якорем на странице с помощью CSS

Задача: необходимо подсвечивать комментарий в ленте, на который ведёт ссылка с помощью якоря (например, по ссылке “поделиться”) и все комментарии, которые идут за ним (новые).

Подсвечиваем конкретный комментарий

Первое, что приходит на ум, это использовать javascript и вырезать якорь из url’a, например:

var url = "www.aaa.com/task1/1.3.html#a_1";
var hash = url.substring(url.indexOf("#") + 1);

с дальнейшим поиском элемента на странице и его подсветкой, однако, это можно сделать значительно проще, используя лишь средства CSS.

В CSS3 добавили псевдокласс :target (подсветка целевого элемента):

.comment:target {
  background-color: lightyellow;
}

Таким образом, мы можем подсвечивать любые блоки на странице, на которые в url’e ведёт идентификатор якоря (а на странице элемент имеет соответствующий атрибут id).

Jsfiddle demo:

Подсвечиваем все новые комментарии

Для подсветки тех комментариев из ленты, которые идут за целевым элементом (например, целевым элементом является последний прочитанный комментарий, а нам требуется подсветить все новые добавленные), нам поможет селектор ~:

.comment:target ~ .comment {
  background-color: lightgreen;
}

Jsfiddle demo:

В качестве заключения: CSS призван помочь именно с поиском и оформлением элементов страницы и решить большую часть возникающих подобных задач, использование javascript’a менее приоритетно.