如何在Rails中使用Nokogiri获取第一个UL元素的子项？

问题分析 #

你遇到的核心问题是CSS选择器的范围问题：

• 当你使用ul li时，这是后代选择器，会匹配所有<ul>标签下的所有层级的<li>元素——包括嵌套在第一个<ul>里的第二个<ul>的子项，所以会拿到[1,2,3,4,5,6]。
• 你尝试的ul:first-child li虽然指定了第一个<ul>，但依然是后代选择器，还是会包含第一个<ul>内部嵌套的<ul>里的<li>。

解决方案 #

这里有两种可靠的方法可以精准获取第一个<ul>的直接子<li>：

方法1：使用直接子元素选择器 >

直接子元素选择器>只会匹配父元素的直接子节点，不会深入到嵌套的子元素中。修改你的代码如下：

uls = xyz_html.css('ul:first-child > li')
uls.each do |li|
  @ul_list_1 << li.text.strip # 加strip可以去掉文本前后的空白
end

这样只会选中第一个<ul>下直接的<li>元素，完全不会涉及嵌套的<ul>里的内容。

方法2：先定位第一个<ul>，再内部查找<li>

这种方式更直观，先单独获取第一个<ul>节点，再在这个节点范围内查找子<li>：

# 获取页面中的第一个ul元素
first_ul = xyz_html.css('ul')[0]
# 仅在第一个ul内部查找li
first_ul.css('li').each do |li|
  @ul_list_1 << li.text.strip
end

如果你的第一个<ul>在父容器里不是第一个子元素，还可以用ul:nth-of-type(1)来精准定位第一个出现的<ul>，替换ul[0]对应的选择器即可。

额外提示 #

如果你的HTML结构里，第一个<ul>有唯一的class或id，直接用类选择器或ID选择器定位会更稳妥，比如：

# 假设第一个ul有class="primary-list"
uls = xyz_html.css('.primary-list > li')

内容的提问来源于stack exchange，提问作者John