Вопросы Теги

Как выбрать каждый шестой div [дубликат]

В Spark> = 1.5 вы можете использовать функцию size : 

from pyspark.sql.functions import col, size

df = sqlContext.createDataFrame([
    (["L", "S", "Y", "S"],  ),
    (["L", "V", "I", "S"],  ),
    (["I", "A", "N", "A"],  ),
    (["I", "L", "S", "A"],  ),
    (["E", "N", "N", "Y"],  ),
    (["E", "I", "M", "A"],  ),
    (["O", "A", "N", "A"],  ),
    (["S", "U", "S"],  )], 
    ("tokens", ))

df.where(size(col("tokens")) <= 3).show()

## +---------+
## |   tokens|
## +---------+
## |[S, U, S]|
## +---------+

In Spark & ​​lt; 1.5 UDF должен делать трюк: 

from pyspark.sql.types import IntegerType
from pyspark.sql.functions import udf

size_ = udf(lambda xs: len(xs), IntegerType())

df.where(size_(col("tokens")) <= 3).show()

## +---------+
## |   tokens|
## +---------+
## |[S, U, S]|
## +---------+

Если вы используете HiveContext, тогда size UDF с необработанным SQL должен работать с любой версией: 

df.registerTempTable("df")
sqlContext.sql("SELECT * FROM df WHERE size(tokens) <= 3").show()

## +--------------------+
## |              tokens|
## +--------------------+
## |ArrayBuffer(S, U, S)|
## +--------------------+

Для строки столбцы, вы можете либо использовать функцию udf, определенную выше, либо функцию length: 

from pyspark.sql.functions import length

df = sqlContext.createDataFrame([("fooo", ), ("bar", )], ("k", ))
df.where(length(col("k")) <= 3).show()

## +---+
## |  k|
## +---+
## |bar|
## +---+

73
задан BoltClock 17 February 2016 в 17:45
поделиться

4 ответа

Это очень распространенная проблема, возникающая из-за непонимания работы :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, который соответствует всем следующим независимым условиям:

  • нечетный номер родительского родителя;
  • имеет класс «строка»; и
  • является потомком элемента 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().

96
ответ дан BoltClock 21 August 2018 в 19:52
поделиться
  • 1
    "(вы заметите, что я использую неупорядоченный список здесь, просто для того, чтобы управлять домашней точкой) & quot; Я желаю, чтобы больше людей были преднамеренно об их использовании заказанных против неупорядоченных пуль. Спасибо за ваш ответ. – The Red Pea 28 August 2016 в 00:40
  • 2
    @ The Red Pea: Один из моих самых больших любимчиков HTML: «В порядке от самого высокого / самого низкого до самого низкого / самого высокого: & quot; за которым следует неупорядоченный список. Я имею в виду, серьезно? – BoltClock♦ 28 August 2016 в 07:15
  • 3
    Ваш ответ блестящий! – Lalit Pal 13 May 2018 в 08:15

Не совсем ..

цитата из docs

Псевдокласс класса :nth-child соответствует элементу с + b -1 братья и сестры перед ним в дереве документов, для данного положительного или нулевого значения для n и имеет родительский элемент.

Он является селектором и не сочетается с классами , В вашем правиле он просто должен удовлетворять обоим селекторам одновременно, поэтому он отображает строки таблицы :nth-child(even), если они также имеют класс .row.

5
ответ дан Gabriele Petrioli 21 August 2018 в 19:52
поделиться

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;
}

Как тип Элементом .rest является <p>, поэтому здесь nth-of-type обнаруживает тип .rest, а затем он накладывает css на 1-й, 2-й, 3-й, 4-й, 5-й элементы <p>.

0
ответ дан Gaurav Aggarwal 21 August 2018 в 19:52
поделиться

Возможно, вы сможете сделать это с помощью xpath. что-то вроде //tr[contains(@class, 'row') and position() mod 2 = 0] может работать. Существуют другие вопросы SO, расширяющие подробности о том, как более точно сопоставлять классы.

0
ответ дан the8472 21 August 2018 в 19:52
поделиться