Это потому, что Kotlin не работает как Java в расширяющихся числах.
В Котлине нет никаких неявных расширяющихся преобразований для чисел . например, вы можете написать что-то на Java, как показано ниже:
int a = 1;
double b = a;
Однако вы не можете написать что-то в Котлине. например:
val a:Int = 1
// v--- can't be widening
val b:Double = a
Это потому, что все в Котлине является объектом, нет примитивных типов, поэтому вы должны явно преобразовать Int
в Double
, например:
val a:Int = 1
// v--- convert it explicitly by `toDouble()` method
val b:Double = a.toDouble()
Это очень распространенная проблема, возникающая из-за непонимания работы :nth-child()
и :nth-of-type()
. К сожалению, в настоящее время нет решения на основе селектора, поскольку селектор не обеспечивает способ сопоставления n-го дочернего элемента, который соответствует произвольному селектору на основе шаблона, такого как нечетные, четные или любые an+b
, где a != 1
и b != 0
.
:nth-child()
псевдокласса подсчитывает элементы среди всех всех их братьев и сестер под одним и тем же родителем. Он не учитывает только братьев и сестер, которые соответствуют остальной части селектора. Аналогично, псевдо-класс :nth-of-type()
считает, что siblings используют один и тот же тип элемента, который относится к имени тега в HTML, а не к остальной части селектора.
Это также означает, что если все дочерние элементы одного и того же родителя имеют один и тот же тип элемента, например, в случае тела таблицы, единственными дочерними элементами которого являются tr
или элемент списка, единственными дочерними элементами которого являются li
, тогда :nth-child()
и :nth-of-type()
будут вести себя одинаково, т. е. для каждого значения an+b
, :nth-child(an+b)
и :nth-of-type(an+b)
будут соответствовать одному и тому же набору элементов.
На самом деле все простые селектора в данном соединении селектор, включая псевдоклассы, такие как :nth-child()
и :not()
, работают независимо друг от друга , вместо того, чтобы смотреть на подмножество элементов, которые сопоставляются остальными селектора.
Это также подразумевает, что нет понятия порядка среди простых селекторов в каждом отдельном селекторе 1, что означает, например, следующие два селектора эквивалентны:
[f 1]При переводе на английский язык оба означают:
Выберите любой элемент
tr
, который соответствует всем следующим независимым условиям:blockquote>
- нечетный номер родительского родителя;
- имеет класс «строка»; и
- является потомком элемента
table
, который имеет класс «myClass».(вы заметите, что мое использование неупорядоченный список здесь, просто для того, чтобы управлять точкой.)
Поскольку в настоящее время нет чистого решения CSS, вам придется использовать скрипт для фильтрации элементов и соответственно применять стили или дополнительные имена классов. Например, следующее обходное решение, использующее jQuery (предполагается, что в таблице есть только одна группа строк, заполненная элементами
tr
):$('table.myClass').each(function() { // Note that, confusingly, jQuery's filter pseudos are 0-indexed // while CSS :nth-child() is 1-indexed $('tr.row:even').addClass('odd'); });
С соответствующим CSS:
table.myClass tr.row.odd { ... }
Если вы используете автоматические инструменты тестирования, такие как Selenium или обрабатываете HTML с помощью таких инструментов, как lxml, многие из этих инструментов позволяют XPath в качестве альтернативы:
//table[contains(concat(' ', @class, ' '), ' myClass ')]//tr[contains(concat(' ', @class, ' '), ' row ')][position() mod 2)=1]
Другие решения, использующие разные технологии, оставил в качестве упражнения читателю; это всего лишь краткий, надуманный пример для иллюстрации.
Для чего это стоит, есть предложение для расширения к
:nth-child()
нотации , которое должно быть добавлено к Селекторы уровня 4 для конкретной цели выбора каждого n-го дочернего элемента, соответствующего данному селектору.2Селектор, в котором для фильтрации совпадений предоставляется в качестве аргумента
:nth-child()
, снова из-за того, как селектора работают независимо от друг друга в последовательности, продиктованной существующим синтаксисом селектора. Итак, в вашем случае это будет выглядеть так:table.myClass tr:nth-child(odd of .row)
(Проницательный читатель сразу заметит, что это должно быть
:nth-child(odd of tr.row)
вместо этого, поскольку простые селекторtr
и:nth-child()
работают независимо друг от друга. Это одна из проблем с функциональными псевдоклассами, которые принимают селекторы, банку червей, которую я предпочитаю не открывать посреди этого ответа. Вместо этого я собираюсь перейти к предположению что большинство сайтов не будут иметь каких-либо других элементов, кроме элементовtr
, как братьев и сестер друг друга в теле таблицы, что сделает любой вариант функционально эквивалентным.)Конечно, будучи новым предложением в новая спецификация, это, вероятно, не увидит реализацию до нескольких лет в будущем. В то же время вам придется придерживаться сценария, как указано выше.
1 Если вы укажете тип или универсальный селектор, он должен быть первым. Однако это не меняет того, как работают селекторы. это не что иное, как синтаксический приступ.
2 Первоначально это было предложено как
:nth-match()
, однако, поскольку оно по-прежнему считает элемент относительным только для его братьев и сестер, а не для каждого другого элемента, который соответствует данному селектору, он с тех пор, как с 2014 года был перепрофилирован как расширение существующего:nth-child()
.
Не совсем ..
Псевдокласс класса
blockquote>:nth-child
соответствует элементу с + b -1 братья и сестры перед ним в дереве документов, для данного положительного или нулевого значения для n и имеет родительский элемент.Он является селектором и не сочетается с классами , В вашем правиле он просто должен удовлетворять обоим селекторам одновременно, поэтому он отображает строки таблицы
:nth-child(even)
, если они также имеют класс.row
.
nth-of-type
работает в соответствии с индексом того же типа элемента, но nth-child
работает только в соответствии с индексом независимо от того, какой тип элементов сиблингов.
Например
<div class="one">...</div>
<div class="two">...</div>
<div class="three">...</div>
<div class="four">...</div>
<div class="five">...</div>
<div class="rest">...</div>
<div class="rest">...</div>
<div class="rest">...</div>
<div class="rest">...</div>
<div class="rest">...</div>
Предположим, что в выше html мы хотим скрыть все элементы, имеющие класс отдыха.
В этом случае nth-child
и nth-of-type
будут работать точно так же, как и все элементы одного типа, <div>
, поэтому css должен быть
.rest:nth-child(6), .rest:nth-child(7), .rest:nth-child(8), .rest:nth-child(9), .rest:nth-child(10){
display:none;
}
OR
.rest:nth-of-type(6), .rest:nth-of-type(7), .rest:nth-of-type(8), .rest:nth-of-type(9), .rest:nth-of-type(10){
display:none;
}
Теперь вам должно быть интересно узнать, в чем разница между nth-child
и nth-of-type
, так что это разница
Предположим, что html is
<div class="one">...</div>
<div class="two">...</div>
<div class="three">...</div>
<div class="four">...</div>
<div class="five">...</div>
<p class="rest">...</p>
<p class="rest">...</p>
<p class="rest">...</p>
<p class="rest">...</p>
<p class="rest">...</p>
В приведенном выше html тип элемента .rest
отличается от других .rest
- это абзацы, а другие - div, поэтому в этом случае if вы используете nth-child
, вы должны писать так
.rest:nth-child(6), .rest:nth-child(7), .rest:nth-child(8), .rest:nth-child(9), .rest:nth-child(10){
display:none;
}
, но если вы используете nss-тип css, это может быть
.rest:nth-of-type(1), .rest:nth-of-type(2), .rest:nth-of-type(3), .rest:nth-of-type(4), .rest:nth-of-type(5){
display:none;
}
Как тип Элементом
blockquote >.rest
является<p>
, поэтому здесьnth-of-type
обнаруживает тип.rest
, а затем он накладывает css на 1-й, 2-й, 3-й, 4-й, 5-й элементы<p>
.
Возможно, вы сможете сделать это с помощью xpath. что-то вроде //tr[contains(@class, 'row') and position() mod 2 = 0]
может работать. Существуют другие вопросы SO, расширяющие подробности о том, как более точно сопоставлять классы.