使用本机 JS 将 HTML 元素替换为字符串内容

Replace HTML element with string content using native JS

本文关键字：替换 字符串 元素 HTML 本机 JS      更新时间：2023-09-26

有以下HTML代码：

<body>
  <menu>
  </menu>
  ... other html
</body>

我需要用变量中的 HTML 内容替换<menu>标签。我知道如何使用带有内容的字符串变量（变量"模板"）更改内部 HTML;

menu.innerHTML = template;

变量"模板"包含'<ul class="menu"></ul>' .因此，我想要以下 HTML：

<body>
  <ul class="menu">
  </ul>
  ... other html
</body>

你提到innerHTML ; 有一个相应的 outerHTML 属性，设置后，将用您的更新替换元素和所有子元素：

var menu = document.getElementsByTagName('menu')[0];
menu.outerHTML = template;

尝试：

var body = document.getElementsByTagName('body')[0];
body.innerHTML = body.innerHTML.replace(/<menu>['s'S]*?<'/menu>/, template);

试试这个

var str = '<ul class="menu"></ul>';
var menu = document.getElementsByName('menu');
var parentMenu = menu.parentNode;
parentMenu.removeChild(menu);
parentMenu.innerHTML = str + parentMenu.innerHTML;

试试这个

var elem = document.getElementsByTagName('body')[0]; // Select any element you want.
var target = elem.innerHTML;
elem.innerHTML = target.replace(/(<menu)/igm, '<ul class="menu"').replace(/<'/menu>/igm, '</ul>');
相关文章：