使用本机JS将HTML元素替换为字符串内容
[英]Replace HTML element with string content using native JS
问题描述
There is the following HTML code: 
有以下HTML代码：
<body>
<menu>
</menu>
... other html
</body>
I need to replace <menu> tag with HTML content from variable. 我需要用来自变量的HTML内容替换<menu>标记。 I know how I can change innerHTML using string variable with content (variable 'template'); 我知道如何使用带有内容的字符串变量（变量“模板”）来更改innerHTML。
menu.innerHTML = template;
Variable 'template' contains '<ul class="menu"></ul>' . 变量'template'包含'<ul class="menu"></ul>' 。 As result I want to have the following HTML: 结果，我想要以下HTML：
<body>
<ul class="menu">
</ul>
... other html
</body>
4 个解决方案
解决方案1
2 2016-03-07 10:24:02
You mention innerHTML ; 您提到了innerHTML ； there's a corresponding outerHTML property that, when set, will replace the element and all children with your update: 有一个相应的outerHTML属性 ，设置后将用您的更新替换元素和所有子元素：
var menu = document.getElementsByTagName('menu')[0];
menu.outerHTML = template;
解决方案2
1 2016-03-07 10:22:34
Try: 尝试：
var body = document.getElementsByTagName('body')[0];
body.innerHTML = body.innerHTML.replace(/<menu>[\s\S]*?<\/menu>/, template);
解决方案3
0 2016-03-07 10:25:35
Try this 尝试这个
var str = '<ul class="menu"></ul>';
var menu = document.getElementsByName('menu');
var parentMenu = menu.parentNode;
parentMenu.removeChild(menu);
parentMenu.innerHTML = str + parentMenu.innerHTML;
解决方案4
0 2016-03-07 10:40:52
try this 尝试这个
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>');
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.