Как добавить еще одно определение оформления текста с помощью Javascript?

Question

Я хочу добавить еще один класс оформления текста с помощью JavaScript к ссылке, с которой уже связан класс.

Я хочу, чтобы что-то вроде <a> активированной ссылки должно иметь text:decoration=none, но я не могу сделать это с помощью CSS, потому что он применяется ко всем ссылкам, тогда, если я объявлю новый класс без оформления.

Как это возможно с JavaScript?

Answer 1

Вы можете сделать это так:

var elem = document.getElementById('ELEMENT_ID_HERE');
elem.style.textDecoration = 'none';

Answer 2

Если вы установите уникальный идентификатор для всех ссылок, которые вы используете, а затем ссылаетесь на ссылку в вашем скрипте, вы можете изменить любые ссылки, которые вы хотите изменить:

document.getElementById('YourLinksId').style.textDecoration = 'overline';
document.getElementById('yourLinksId').onmouseover.style.textDecoration = 'blink';

Стиль, установленный вами непосредственно для элемента, переопределяет любые атрибуты, установленные в классе css.

Редактировать: Извините, я думаю, я неправильно понял ваш вопрос. Если вы имеете в виду активированный, как при нажатии на ссылку, при наведении курсора вы можете сделать следующее:

a:link {color: #FF0000}     /* unvisited link */
a:visited {color: #00FF00}  /* visited link */
a:hover {color: #FF00FF}   /* mouse over link */
a:active {color: #0000FF}   /* selected link */

Больше ресурсов в w3schools

Answer 3

Активная ссылка активна только при нажатии на .

Как только вы отпустите кнопку мыши, у нее больше не будет активное состояние. Поэтому вы можете использовать a: active , который применяется к всем ссылкам, поскольку только одна из них когда-либо будет активна одновременно.

Я предполагаю, что вы действительно хотите, чтобы он сохранил текстовое оформление: ни один, пока не будет нажата другая ссылка, в этом случае вам понадобится JavaScript. Если я не прав, просто следуйте примеру @ ChrisAD, но добавьте:

a:active {color: #0000FF;

   text-decoration: none;

}   /* selected link */

Answer 4

Я бы порекомендовал использовать такие фреймворки, как mootools (http://mootools.net/).

С рамками это так просто, как:

element.addClass('my_new_css_class');

или вы можете просто добавить новый стиль

element.setStyle('text-decoration', 'none');

Answer 5

Если вы хотите использовать классы CSS:

var element = document.getElementById(idOfElement);
element.className = element.className + " noDecorationClass";

Это добавляет новый класс к элементу, вы также можете перезаписать существующий.

element.className = "noDecorationClass";