javascript - 如何让 html 显示在页面上而不是运行？

This question already has answers here:

Display HTML snippets in HTML

(25 个回答)


4年前关闭。




我的问题似乎与大多数其他人的问题相反。我不希望 .innerHTML 中的 HTML 运行。我希望它按原样显示在页面上。 (我知道我的代码中还有另一个问题。我正在解决这个问题)

https://jsfiddle.net/ojfykv17/
或者

<div id="code">

</div>

    function genorateCode() {
    		var account = document.getElementById("account");
        var url = document.getElementById("url");
        sendCode();
    }
    function sendCode() {
    document.getElementById('code').innerHTML = '<a href="'+url+'">'+'<div class="button"><img src="https://s15.postimg.org/mfpd2ki8r/icon.png" width="16">@'+account+'</div></a>';
    }
    sendCode();

    .button {
    border-radius: 5px;
    background-color: white;
    border:1;
    border-style: solid;
    position: fixed;
    padding: 5px 10px 5px 10px;
    border-width: 1.2px;
    line-height: 5px;
    border-color: #a5aab1;
    font-family: 'Lato', sans-serif;
    font-weight:300;
    text-align: center;
    }

<form id="form" onsubmit="return false;">
        <input type="text" id="account" />
        <input type="text" id="url" />
        <input type="submit" onclick="genorateCode();" />
    </form>

    <div id="code">

    </div>

最佳答案

设置元素的 innerHTML 而不是设置 innerText 。

document.getElementById('code').innerText = '<a href="'+url+ ...