Javascript 正则表达式属性替换

我正试图计算出一些正则表达式，我在一个方向上工作，但当我更改属性时失败了

我试图实现的是找到align的值并将该值替换到类中

var s = '<img src="" align="left" class="smart" title="title for reference" />';
var reg = new RegExp(/(?:align="(.*?)").*?(?:class="(.*)")/);
console.log( s.replace(reg ,'class="image-$1 $2"') );

这可以很好地工作并输出数据

<img src="" class="image-left smart" title="title for reference" />

---

但是，如果我将类放在align之前修改html，我只会得到原始html字符串，您可以使用jQuery来实现这一点

var s = '<img src="" align="left" class="smart" title="title for reference" />';

$('<div/>').append(
    $(s).addClass('image-' + $(s).attr('align'))
        .removeAttr('align')
).html();

其优点是不依赖于属性的特定顺序等。。当然，您可以将修改后的HTML添加到DOM树中，而不是使用$的技巧来获取HTML文本。

正则表达式在处理标记方面非常糟糕，因为标记不是正则的。当您在浏览器中工作时，您已经有了一个功能强大的HTML解析器供您使用，因此使用正则表达式并不是最佳选择

正如所述，使用jQuery可以很容易地做到这一点。下面是一个纯DOM等价物：

var div = document.createElement("div");

div.innerHTML = s;

var img = div.firstChild;

img.className += " image-" + img.getAttribute("align");
img.removeAttribute("align");

console.log(div.innerHTML);

强制链接：