Question

我正在尝试使用vanilla JavaScript向文档追加一个元素，但它给了我这个错误：＆＃34;未捕获的DOMException：无法执行＆＃39; createElement＆＃39; on＆＃39; Document＆＃39;：提供的标签名称（＆＃39;＆＃39;）不是有效名称。＆＃34;

这是我所有的js代码：

＆＃13;

function newProject(root,img) {
    const project = document.createElement("<div class='element'><a href='" + root +"'><img src='"+ img +"'></a></div>");
    const element = document.querySelector(".projects");
    element.appendChild(project);
}

newProject('../projects/periodic-table/tabla-periodica.html', '../img/tabla-valencias.png');

＆＃13;

Answer 1

document.createElement只会创建一个空元素，例如<div></div>，并且只会将标记名称（div）作为参数。所以你应该手动构建你的元素：

const project = document.createElement('div');
project.className = 'element';

const projectLink = document.createElement('a');
projectLink.href = root;
project.appendChild(projectLink);

const image = document.createElement('img');
image.src = img;
project.appendChild(image);

_{您还可以使用.innerHTML直接将HTML内容插入节点，但是用于动态内容（即由变量生成，例如在您的情况下）。我建议不要这样做，因为这不会逃避变量的内容，让你对代码的XSS攻击感到难受。}

尝试使用vanilla js将div附加到文档中

1 个答案: