Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > Вёрстка веб-сайтов > Как добавлять свои аттрибуты

Автор: sergejzr 9.6.2008, 16:02

Проблема такая у меня:
На сайте несколько ссылок, но не все ссылки - просто ссылки. Некоторые особенные. При нажатии на эти ссылки выполняется скрипт и этот скрипт должен определять тип ссылки и в зависимости от этого выполнять то или другое действие.
пример(чего хочется):
<a href="1.html" command="go" onclick="executeCommand(this)">Перейти на 1</a>
<a href="2.html" command="run" onclick="executeCommand(this)">Перейти на 2</a>
<a href="3.html" command="swim" onclick="executeCommand(this)">Перейти на 3</a>

Handler "onclick" присваивается всем ссылкам автоматически скриптом, а юзер уже с помощью "command" контролирует ситуацию.

Автор: SelenIT 10.6.2008, 16:07

Браузеры поймут, если прямо так и написать - незнакомые атрибуты никак не повлияют на отображение, но будут доступны скрипту через getAttribute. Валидной, правда, такая верстка не будет, но на практике это никакого значения не имеет. Можно, конечно, написать свой DTD (наподобие того, как http://xhtml.ru/forum/viewtopic.php?pid=5100#p5100 к DTD XHTML1.1 добавили атрибут target), но это имеет смысл лишь в одном случае - если XHTML-страницу для какой-либо цели предполагается парсить сторонним валидирующим парсером. Для браузеров так изголяться не нужно, им валидность по DTD побоку...

Альтернативный вариант - передавать нужные параметры через существующие атрибуты, напр. rel и class (как делают микроформаты).

Автор: sergejzr 10.6.2008, 17:37

Цитата(SelenIT @ 10.6.2008, 15:07

)

Альтернативный вариант - передавать нужные параметры через существующие атрибуты, напр. rel и class (как делают микроформаты).

Можно поподробнее?

Автор: POLTER 10.6.2008, 18:09

Цитата

Можно поподробнее?

Используешь вместо атрибута "command" атрибут "rel".
Т.е. что-то типа <a href="#" rel="go" onclick="executeCommand()">Перейти на 1</a>
А в яваскрипте уже получаешь команду через getAttribute:

Код


<script>
function executeCommand()
{
    var a = document.getElementsByTagName('a')[0];
    alert(a.getAttribute('rel'));
}
</script>

Добавлено через 56 секунд
Таким образом, сохраняется валидность страницы и при этом можно хранить нужную информацию в этом атрибуте.

Автор: SelenIT 10.6.2008, 18:23

Например, наподобие такого:
<a href="1.html" class="toolbar command_go" onclick="executeCommand(this)">Перейти на 1</a>
<a href="2.html" class="toolbar command_run" onclick="executeCommand(this)">Перейти на 2</a>
<a href="3.html" class="toolbar command_swim active" onclick="executeCommand(this)">Перейти на 3</a>

и в скрипте

Код


function executeCommand(obj) {
   var command = obj.className.match(/\bcommand_(\w+)\b/);
   if (!command) return true; // просто ссылка
   else { // работаем с командой, она в command[1]
      ...

Преимущество атрибута class в этом смысле - что там абсолютно легально может быть несколько практически чего угодно). Не знаю, правда, скажется ли такое нецелевое использование классов на скорости рендеринга страницы...

А про микроформаты неплохо написано http://softwaremaniacs.org/blog/2005/06/26/microformats/ (хоть статья и старая)...