Cheerio - 在同级下缩进新插入的元素？

Question

我正在使用 cheerio 来改变节点中的 xml 文件。我在 <source> 之后插入 node/element <target>，它与 oldEl.translation.insertAfter(msgSourceEl); 中的 insertAfter() api 一起使用。

然而，我松了缩进：

  <trans-unit id="title" datatype="html">
    <source>Login</source><target>iniciar sesión</target>

是否有可能，或者是否有办法，在 <source> 元素下缩进新插入的 <target>iniciar sesión</target>？

Answer 1

只需修复最后的 XML 缩进：

可以使用xml-beautifier实现人类可读的缩进XML

import beautify from 'xml-beautifier';
const HumanXML = beautify(XML);
console.log(HumanXML); // => will output correctly indented elements

---

（额外）不需要 Cheerio :

在下面的示例中，我们将使用 xml2js 将 XML 操作为 JSON，然后将其构建回原始 XML 格式

var xml2js = require('xml2js');
var xml = "<trans-unit id=\"title\" datatype=\"html\"><source>Login</source></trans-unit>"

xml2js.parseString(xml, function (err, result) {
    result["trans-unit"].target=["iniciar sessión"]
    var builder = new xml2js.Builder();
    var xml = builder.buildObject(result);
    console.log(xml)
});

最终输出：

<trans-unit id="title" datatype="html">
  <source>Login</source>
  <target>iniciar sessión</target>
</trans-unit>

我确定您是在循环中执行此操作，因此推断该示例以使其工作应该不难。我建议通常使用 underscore (each, map, reduce, filter...)

Answer 2

首先，由于source是一个空元素，cheerio不保留<source>Login</source>。它将其转换为 <source>Login

因此，为了演示元素缩进，我将使用 <source2> 元素。

如下所示，提供换行符和制表符作为给定 html 的一部分可以解决问题。

let $ = require('cheerio').load(`
<trans-unit id="title" datatype="html">
    <source2>Login</source2>
</trans-unit>`)

$(`
    <target>iniciar sesión</target>`).insertAfter($('source2'));
console.log($.html('trans-unit'))

输出

<trans-unit id="title" datatype="html">
    <source2>Login</source2>
    <target>iniciar sesión</target>
</trans-unit>