javascript - 在nodejs上使用带有javascript的正则表达式查找html属性并在其值前面添加一些内容

Question

我在 JS 中有一些标记，如下所示:

<div class="col-sm-4">
    <span id="some-media" class="media">Text</span>
</div>

我想选择范围的类属性，并在其值前面加上字符:“::”。因此，在正则表达式替换之后，我最终会得到:

<div class="col-sm-4">
    <span id="some-media" class="::media">Text</span>
</div>

编辑:请注意，HTML 元素中属性的顺序是可变的，因此我的 span 属性很可能具有不同的顺序，如下所示:

<div class="col-sm-4">
    <span class="::media" id="some-media" >Text</span>
</div>

Answer 1

你有一个正则表达式解决方案，这是一个 DOMmy 解决方案:

var html = `<div class="col-sm-4">
    <span id="some-media" class="media">Text</span>
</div>`
var doc = (new DOMParser()).parseFromString(html, "text/html");
var el = doc.getElementsByTagName('span')[0];
el.setAttribute('class', '::' + el.className);
console.log(
  doc.getElementsByClassName('::media').length > 0 // check if modification's done
);

由于除了正则表达式之外没有其他办法，这可以被视为一种解决方法:

(<span[^>]*class=.)([^'"]+)

JS:

var html = `<div class="col-sm-4">
    <span id="some-media" class="media">Text</span>
</div>
<span class="media" id="some-media">Text</span>
`;

console.log(
    html.replace(/(<span[^>]*class=.)([^'"]+)/g, `$1::$2`)
);