JavaScript для выбора CSS

Question

Я хотел бы преобразовать эту строку кода JavaScript в CSS, я искал сайт и Google, но не получил прямого ответа.

var riskCell20 = document.getElementById("risk.probablity.literal.l100").childNodes[2];

что-то вроде

#risk.probablity.literal.l100:nth-child(2);

не удалось найти правильный синтаксис

Answer 1

Поскольку символ . имеет особое значение для селектора, вам, возможно, придется его избежать:

#risk\.probablity\.literal\.l100:nth-child(2);

Answer 2

Поскольку id имеет точки, которые являются символом целевого класса, вы можете использовать селектор атрибута.

[attribute="value"]

С его помощью вы можете выбрать атрибут элемента, такой как title, href и т. Д., И в этом случае его id.

Образец фрагмента стека

[id="risk.probablity.literal.l100"] :nth-child(2) {
  color: red;
}

<div id="risk.probablity.literal.l100">
  <div>1</div>
  <div>2</div>
  <div>3</div>
</div>

---

Обратите внимание, что nth-child не основано на нуле, childNodes, поэтому, если вы хотите третьего ребенка (childNodes[2]), ваш nth-child должен быть 3 (nth-child(3))