Использование TILDE внутри сложного селектора jQuery/CSS3

Question

Я изо всех сил пытаюсь понять селектор jQuery, который я нашел внутри jsFiddle (http://jsfiddle.net/Pm3cj/3/). Селектор:

'~.container, ~:has(.container)' 

В чем смысл тильды?

• Это что-то вроде :not?
• это какой-то частичный матч ~= оператор?
• Это какая-то вариация селектора «next siblings»?

Я искал много на JQuery и сайтах W3C, не находя такое использование тильды. По крайней мере, я этого не узнал.

Любой может сказать мне, где такое использование тильды объясняется?

Answer 1

Помните, что синтаксис синтаксиса jQuery основан на синтаксисе селектора CSS, а в CSS тильда обозначает «любой из следующих братьев и сестер». Так

`~:has(.container)` 

... находит любые исходящие братья и сестры, которые имеют класс container.

Answer 2

Это было бы неудобно комментировать, так что здесь идет:

Вот пример;

[att~=val] 

и от docs;

Представляет элемент с атрибутом ATT, значение которого представляет собой белый пробелами список слов, одно из которых точно «Вал». Если «val» содержит пробел, он никогда не будет представлять ничего (поскольку слова разделены пробелами). Если «val» - это пустая строка, то никогда не будет представлять ничего.

---

Следующие селекторы иллюстрируют различия между "=" и "~ =". Первый селектор будет соответствовать, например, значению «copyright copyylelete copyeditor» для атрибута «rel». Второй селектор будет соответствовать только тогда, когда атрибут «href» имеет значение «http://www.w3.org/».

a[rel~="copyright"] 
a[href="http://www.w3.org/"] 

Прочитав это, я надеюсь, что вы могли бы понять физический использовать для этого. Он позволяет вам выбрать «включает» как таковой. Поскольку на самом деле нет селектора ':includes', можно использовать '~', обычно с :contains.

---

Я верю в вашем примере,

'~.container, ~:has(.container)' 

ли тестирование, если вы можете «найти» класс container где-нибудь после этого, или элемент, который «включает» эту container где-нибудь после того, как ваша кнопка»нажата элемент.