Выбираете ссылку HTML, в результате чего элементы CSS меняют цвета?

Question

Есть ли способ (возможно, с использованием Javascript?) Изменения сведений об элементе CSS, когда пользователь щелкает ссылку HTML?

Моя цель здесь состоит в том, чтобы затенить серию ссылок, определенных как:

<a href="#" title="MyLink"><span>Link</span></a>

и класс, определенный как:

.Document
{
    background:#000;
}

После того, как пользователь щелкнет MyLink, я бы хотел, чтобы класс Document изменил свой фон на что-то другое .... скажем#ccc.Я также хотел бы, чтобы он вернулся в исходное состояние при выборе другой ссылки, например, MyLink2.

Возможно ли это вообще?Если так, то кто-нибудь знает, где искать хотя бы начало решения?

Answer 1

JQuery! - http://jquery.com/

$("your-selector").click(function(){
    $("your-destination").css("border-color","#CCC");
});

Подайте заявку на каждую ссылку, и она должна это сделать!

Answer 2

Вы можете использовать псевдоселектор :focus CSS:

a:focus {
  background-color: #ccc;
}

Теперь, когда пользователь нажимает на ссылку, фон становится серым.

Answer 3

<a href="#" title="MyLink" onclick='document.body.style.background="#CCC";'>Link</a>

Answer 4

Я предполагаю, что имя класса .Document применимо к ряду других элементов, а не к самой ссылке.

В этом случае рекомендуется создать другое имя класса (например, .document-active) и изменить имя класса для всех элементов, к которым применяется .Document при нажатии MyLink.

Используя вашу разметку выше (и jQuery):

$(function(){
  $("a[title='MyLink']").click(function(){
    $('.Document').removeClass('Document').addClass('document-active');
    return false;
  });
});