Question

我正在研究我的一个小型随机项目，但我遇到了一个问题。我正在使用onclick按钮事件来组织具有不同主题的图片。但是，当我尝试将代码放入.innerHTML部分时，它会破坏代码并且无法工作。难道我做错了什么？这是我的代码

SELECT `name` FROM ...

显然，有更多的按钮，因此更多的主题，但我只是向您展示保持整洁的基础。难道我做错了什么？我是否需要其他Javascript代码或输出才能使其正常工作？感谢。

Answer 1

您的图片HTML错误。图像的语法是

<img src="imagelinkgoeshere">

所以功能应该是：

function Function1() {
    document.getElementById("demo").innerHTML = '<img src="imagelinkgoeshere">';
}

Answer 2

使用innerHTML的一个更好的替代方法是动态创建图像HTML元素，然后将其插入div：

function Function(1) {
    var container = document.getElementById('demo');
    var img = document.createElement('img'); // creates an <img> HTML element
    img.src = 'imageurl.png'; // Giving the image some a target to display
    demo.appendChild(img); // Add the newly created image to the container #demo

}

如何在使用onclick事件时加载html内容？

2 个答案: