尝试使用Javascript将HTML元素插入另一个HTML元素
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了尝试使用Javascript将HTML元素插入另一个HTML元素相关的知识，希望对你有一定的参考价值。
各位大家好，所以iam尝试使用javascript将html元素插入另一个HTML元素。
我尝试使用.insertAdjacentHTML，但它将它插入目标元素附近，因为位置不适合我...而.html将其插入为文本格式而不是HTML格式
这是我尝试编码： -
SendClientMessage(COLORS_.white, "15px", "none", '<div class="ls-files">' + CMDS_List + '</div>');
function SendClientMessage(color, font, align = 'none', message)
{
if(align !== "none")
{
output_.insertAdjacentHTML('beforeend', '<p style="color: ' + color + '; font-size: ' + font + '; text-align: ' + align + ';">' + message + '</p>');
}
else if(align === "none")
{
output_.insertAdjacentHTML('beforeend', '<p style="color: ' + color + '; font-size: ' + font + ';">' + message + '</p>');
}
}
输出：-
<p style="color: #FFFFFF; font-size: 15px;"></p>
<div class="ls-files">clear,clock,dati,ping,uname,whoami,cmd,</div>
答案
您只能使用insertAdjacentHTML将内联元素（如span或a）放入p标记中，因为它使用的html解析器在插入内容之前检查格式正确的html。
let CMDS_List = 'clear,clock,dati,ping,uname,whoami,cmd,';
SendClientMessage('white', "15px", "none", '<span class="ls-files">' + CMDS_List + '</span>');
function SendClientMessage(color, font, align = 'none', message) {
let output_ = document.getElementById('output');
if (align !== "none") {
output_.insertAdjacentHTML('beforeend', '<p style="color: ' + color + '; font-size: ' + font + '; text-align: ' + align + ';">' + message + '</p>');
} else if (align === "none") {
output_.insertAdjacentHTML('beforeend', '<p style="color: ' + color + '; font-size: ' + font + ';">' + message + '</p>');
}
} body {
background: #999;<div id="output"></div>以上是关于尝试使用Javascript将HTML元素插入另一个HTML元素的主要内容，如果未能解决你的问题，请参考以下文章
使用javascript在特定元素之后插入div的最佳方法[重复]