更改字符串 HTML 中的图像源属性并再次返回字符串 HTML

Question

我有 html 网页，我想将此网页下载为 pdf。所以我将此网页转换为字符串，并且我必须发送到服务。即我有不变的字符串html。我无法为拆分字符串 html 添加指示符。当 html 网页太大而带有 base 64 字符串图像时，我必须用头像图像 url 更改这个 base 64 字符串（因为它太大而无法使用 json 发送数据）。我有一个简短的 html 字符串，其中更改了 base 64 字符串，然后我可以发送到服务端下载 pdf。我有一个 HTML 字符串（它看起来像我真正的 html 字符串）见下文：

var stringHTML = 
"
<div id="myDiv">
   <img src="abc" /></div>
   <img src="abc" /></div>
   <img src="abc" /></div>
   <img src="abc" /></div>
</div>
";

我想将图像src 属性值更改为xyz。即我想将 HTML 字符串转换为：

stringHTML = 
"
<div id="myDiv">
   <img src="xyz" /></div>
   <img src="xyz" /></div>
   <img src="xyz" /></div>
   <img src="xyz" /></div>
</div>
";

如何通过再次返回字符串值来更改此源属性值？即更改操作后我必须有字符串 html..

Answer 1

根据链接的possible duplicate question，您可以执行以下操作：

stringHTML = stringHTML.replace(/abc/g,"xyz");

或

stringHTML = stringHTML.replace(new RegExp("abc","g"),"xyz"); 

还值得注意的是，您当前的字符串无效。您要么需要用单引号 (') 替换开始和结束双引号 (")，要么转义字符串中使用的双引号。而且，正如 Ivan 在 cmets 中提到的那样，javascript 不能在没有特殊允许的情况下跨行（转义换行符等）。我认为你可以这样定义它：

let stringHTML = ' +
    <div id="myDiv"> +
      <img src="abc" /></div> +
      <img src="abc" /></div> +
      <img src="abc" /></div> +
      <img src="abc" /></div> +
    </div>';

您也可以创建一个数组并立即加入：

let stringHTML = [
    '<div id="myDiv">',
        '<img src="abc" /></div>',
        '<img src="abc" /></div>',
        '<img src="abc" /></div>',
        '<img src="abc" /></div>',
    '</div>'
].join('');

有关多行字符串定义的更多信息，请参阅this question。