没有jquery的第二个孩子

Question

我想找个方法来选择#inner3......

 <div id="outer">
      <div id="inner1"> </div>
      <div id="inner2"> </div>
      <div id="inner3"> of interest </div>
      <div id="inner4"> </div>
 </div>

...从最后一次计数(#inner4)因为有时#2不存在...

 <div id="outer">
      <div id="inner1"> </div>
      <div id="inner2"> of interest </div>
      <div id="inner3"> </div>
 </div>

并且只有3个项目(因此#inner3变为#inner2).

请注意,#id为了清楚起见,并没有真正出现在我的工作中.

我正在使用,body > .. > div:nth-child(3)但如上所述,从顶部算起是一个问题.

对此有何解决方案？

Answer 1

你应该能够抓住你的元素

 documentObject.lastChild.previousSibling

这里documentObject是你的parent.

编辑

感谢David Thomas:更准确的是 previousElementSibling因为它返回一个Element而不是一个文本节点:

documentObject.lastChild.previousElementSibling

资料来源:
W3Schools
developers.mozilla

Answer 2

如果我没理解错的话，你可以从末尾开始数:nth-last-child()：

.outer *:nth-last-child(2){
  color: green;
}