Оформление гиперссылок…

Есть очень любопытная статья на сайте «заметки HTML кодера» [ >>> ] Рассказывать о чём она я не буду (лучше сходите и почитайте), но там есть весьма любопытное «домашнее задание». :)

К сожалению, мы не ограничемся одной строкой JavaScript'а, если решим также эмулировать в IE CSS свойство content. Оставлю это в качестве домашнего задания тем, кому это нужно.

Я решил, что вполне смогу ограничится одной строкой на JavaScript, довольно длинной, правда:

font-weight:expression((this.getAttribute(«target»)=="_blank" && this.getAttribute(«done») == null) ? ((this.innerHTML+=unescape(' %28в новом окне%29')),(this.setAttribute('done','yes')),"bold") : «normal»)

Извращения вида «== null» вместо «!="yes"» и «unescape('%28…%29')» вместо «(…)» пришлось поставить из-за странного нежелания Internet Explorer воспринимать эти конструкции адекватно.

Аттрибут «done» я использую в качестве флага, что элемент уже был обработан; попробуйте убрать все упоминания о нём и наведите мышкой на ссылку, сразу поймёте какова его роль.

Комментарии 14

Александр № 3
font-weight:expression((this.target=="_blank" && this.done == null) ? ((this.innerHTML+=' (в новом окне\x29'),(this.done=1),"bold") : «normal»)

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

а чтобы делать через css, то можно скрипт завернуть в htc
тогда уж и неважно сколько такм строчек
Евгений Степанищев автор № 4
Твоё решение противоречит DOM. А по поводу HTC… На моё решение повлияли исходные данные.
alshur № 5
Круто! Я пробовал, конечно, this.innerHTML += …, но заметил неадекватное поведение IE и отказался от такой идеи. Думал использовать какой-то флаг, но это предполагало бы установку этого флага вне CSS. Установить флаг в самом теге я не догадался ;-)
Андрей М. № 11
Извините, не могу молчать:)
target — это HTML DOM:)

interface HTMLLinkElement : HTMLElement {
attribute boolean disabled;
attribute DOMString charset;
attribute DOMString href;
attribute DOMString hreflang;
attribute DOMString media;
attribute DOMString rel;
attribute DOMString rev;
attribute DOMString target;
attribute DOMString type;
};

http://www.w3.org/TR/2003/REC-DOM-Level-2- … D-84183095

поэтому можно сократить строку раза в два, во-первый this.target, а во-вторых (что меня больше всего удивило) флаг устанавливать this.done — в яваскрипте свойство создается, если просто привоить ему значение

В итоге должно работать и так:
font-weight:expression((this.target=="_blank" && !this.done)?(this.innerHTML+=unescape(' %28в новом окне%29'),this.done=true,"bold") : «normal»)
Евгений Степанищев автор № 12
Хм.. Мне всегда казалось, что доступ к аттрибутам должен происходить исключительно через getElement :) Ну, this.done — всё равно никак не DOM :) Кстати, там нигде не написано, что разрешён непосредственный вызов или я что-то проглядел?
Андрей М. № 13
В HTML DOM атрибут элемента == свойство соответствующего объекта
http://www.w3.org/TR/2003/REC-DOM-Level-2- … -642250288
В отличие от XML DOM, где доступ к атрибуту возможен именно через getAttribute/setAttribute исключительно.

Что касается this.done: для яваскрипта объекты DOM — это host object, объекты представляемые окружением, которые во всем остальном являются такими же объектами, как встроенные (built-in objects) или созданные разработчиком. Т.е. мы можем делать с ними что захотим: добавлять им свойства, удалять, изменять и т.п. (в реальности не всегда получается, но в теории так) В Мозилле можно кстати говоря, вообще написать HTMLElement.prototype… изменяя свойства и методы вообще любых HTML элементов.

Таким образом, мы просто создаем свойство done всех объектов — ссылок, и в скрипте, который выполняется внутри expression у объекта есть свойство done и оно равно true.

Извиняюсь, если коряво объяснил, с красноречием у меня беда :-)