代码之家  ›  专栏  ›  技术社区  ›  ankur

解析ul和ol中的嵌套li

  •  0
  • ankur  · 技术社区  · 7 年前

    我有一个场景,当李 联邦制药 我需要用点(.)替换它当李来的时候 ol 我需要用一个数字来代替它。

    但问题是-

    1) 这对嵌套li不起作用

    2) 它在同一级别追加。同一级别意味着一旦找到li,它将首先添加 dot(.) 然后它会添加 数字

    我想要什么

    1) 每当li进入ul时,应添加点(.)。

    2) 每当李进入ol时,它应该添加一个数字。

    data = "<ol>\n<li>Introduction\n<ol>\n<li>hyy ssss</li>\n</ol>\n</li>\n<li>Description</li>\n<li>Observation</li>\n<li>Results</li>\n<li>Summary</li>\n</ol>\n<ul>\n<li>Introduction</li>\n<li>Description\n<ul>\n<li>Observation\n<ul>\n<li>Results\n<ul>\n<li>Summary</li>\n</ul>\n</li>\n</ul>\n</li>\n</ul>\n</li>\n<li>Overview</li>\n</ul>\n<p>All the testing regarding bullet points would have been covered with the above content. Hence publishing this content will make an entry in in the selected  page, cricket page and so on.</p>\n"
    
        content = Nokogiri::HTML.parse(data)
        content.at('ul').children.xpath("//li").each { |li| li.inner_html="\u2022 "+li.inner_html }
        content.at('ol').children.xpath("//li").each_with_index { |li,index| li.inner_html="#{index} "+li.inner_html }
    
    1 回复  |  直到 7 年前
        1
  •  1
  •   kiddorails    7 年前

    也许您需要:

    content.css('ol').reverse.each do |ol| 
      ol.css('> li').each_with_index { |li,index| li.inner_html="#{index + 1} "+li.inner_html }
    end
    content.css('ul > li').reverse.each { |li| li.inner_html="\u2022 "+li.inner_html }
    
    puts content
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">
    <html><body>
    <ol>
      <li>1 Introduction
        <ol>
          <li>1 hyy ssss</li>
        </ol>
      </li>
      <li>2 Description</li>
      <li>3 Observation</li>
      <li>4 Results</li>
      <li>5 Summary</li>
    </ol>
    <ul>
      <li>• Introduction</li>
      <li>• Description
        <ul>
          <li>• Observation
            <ul>
              <li>• Results
                <ul>
                  <li>• Summary</li>
                </ul>
              </li>
            </ul>
          </li>
        </ul>
      </li>
      <li>• Overview</li>
    </ul>
    </body></html>
    

    执行的原因 reverse -
    考虑dom:

    <ul>
      <li>Description
        <ul>
          <li>Observation</li>
        </ul>
      </li>
    </ul>
    

    当你这样做的时候 content.css('ul > li') ,按[描述,观察]的顺序排列。没有 颠倒 ,运行代码段时,您可以更改 描述 ,但这样做也会改变 object_id 属于 观察 节点。然后你改变了 观察 未在中的任何位置引用的节点 content .这就是为什么我把它颠倒过来 children 在父母面前。通过这样做,我确保我先改变孩子,然后再改变父母 父母亲 已知道子节点中的更改,并且任何位置都没有未引用的节点。

    假设描述的节点id为1234,观察节点id为2345。当你 变异 描述,它改变了自己,但也改变了它的孩子(2345)。新对象id可以分别为3456和4567。然后您更改了2345(通过迭代),但没有效果,因为您的 所容纳之物 显示3456->4567

    希望这有意义。