A: not (a: not ([href])) селектор

Я хочу, чтобы определенное действие было связано с событием click тега привязки при его атрибуте href:

  • не начинается с mailto: и
  • не заканчивается на # и
  • присутствует с любым значением, включая пустые

Итак, я пытался использовать этот код:

<a href="example.com">example.com</a>
<a href="mailto:[email protected]">Someone</a>
<a href="thepage#">The Page</a>
<a>This does nothing</a>

<script type="text/javascript">
    $(document).on('click', 'a:not([href^="mailto\\:"], [href$="\\#"], [href])', myFunction);
</script>

И это не сработало. Но, к моему сожалению, это работает:

$(document).on('click', 'a:not([href^="mailto\\:"], [href$="\\#"], a:not([href]))', myFunction);

Но я не понимаю, как это сделать. Обратите внимание на внутренний :not(). Насколько я понимаю, [href] означает, что атрибут href отсутствует. Или это наоборот?

Может ли кто-нибудь привести меня к свету?

Ответы

Ответ 1

[href] означает, что есть атрибут href независимо от того, какое значение имеет его значение.

Как правильно указал pimvdb, вы можете использовать

a[href]:not([href^="mailto\\:"], [href$="\\#"])

Что означает "все элементы с любым атрибутом href, за исключением тех, чей атрибут href начинается с mailto: или заканчивается на #