使用 Cheerio 取消多个嵌套 HTML 元素

问题描述 投票：0回答：1

给定一个包含多个嵌套元素的 HTML 字符串，如何使用 

font
删除所有 
cheerio
元素，同时保留最里面 
font
元素的内部内容？

例如这是之前的

<body>
  <font>
    <font>
      <font>
        <p>Three fonts deep</p>
      </font>
    </font>
    <font>
      Two fonts deep
    </font>
  </font>
  <font>
    One font deep
  </font>
  No fonts deep  
</body>

这是之后

<body>
  <p>Three fonts deep</p>
  Two fonts deep
  One font deep
  No fonts deep
</body>

我已经尝试过

unwrap

$('font').each((i, el) => {
  $(el).unwrap();
});

和

replaceWith

$('*').each((i, el) => {
  if (el.name === 'font') {
    $(el).replaceWith($(el).html());
  }
});

这两者都只去除字体的外层。我怀疑在 

each
循环中更改 HTML 会导致问题？

如果我在 

while
循环中运行替换，它确实有效。

let foundFonts;
do {
  foundFonts = 0;
  $('font').each((i, el) => {
    $(el).replaceWith($(el).html());
    foundFonts++;
  });
} while (foundFonts > 0);

我想知道，是否有一种有效的方法可以一次性删除字体元素？

html cheerio
1个回答
0
投票

尝试在您的 

replaceWith
尝试中反向迭代：

const cheerio = require("cheerio"); // ^1.0.0-rc.12

const html = `<body>
  <font>
    <font>
      <font>
        <p>Three fonts deep</p>
      </font>
    </font>
    <font>
      Two fonts deep
    </font>
  </font>
  <font>
    One font deep
  </font>
  No fonts deep  
</body>`;

const $ = cheerio.load(html);

[...$("font")]
  .reverse()
  .forEach(el => $(el).replaceWith($(el).html()));

console.log($.html())

输出：

<html><head></head><body>
  
    
      
        <p>Three fonts deep</p>
      
    
    
      Two fonts deep
    
  
  
    One font deep
  
  No fonts deep  

</body></html>
最新问题
© www.soinside.com 2019 - 2024. All rights reserved.