Question

我已经在下面编写了代码，但是由于安全原因，现在我必须使用jQuery编写代码。我以前从未用jQuery做过什么，我真的不知道该怎么写。我不应该将HTML与JS混合使用，而应该使用createElement之类的东西。

var demoName1 = "Peter Stone";
function showMessage() {
    var newMsg = '<div id="messageBoxSend">' +
        '<div class="nameSend">' + demoName1 + '</div>' +
        '<div class="text">' +
        ' <div id="FscToolPaneNoseSend">' +
        '</div></div>' +
        document.getElementById('inputText').value;

var a = new Date();
    var b = a.getHours();
    var c = a.getMinutes();
    if (c < 10) {
        c = "0" + c;
    }
    var time = b + ':' + c;

    newMsg += '<div class="time">' + time + '</div>' +
        ' </div></div><br>';
...
}

Answer 1

jQuery是JavaScript的库，因此，是的，如果您认为JavaScript不安全，那么jQuery也是如此。另外，jQuery使AJAX变得更容易，但是并不能证明Jquery比javascript安全。

Answer 2

您将尝试使用此代码

$（'class或id'）。html（''）;

$（'class或id'）。html（newMsg）;

Answer 3

类似于下面的内容。您可能应该研究jQuery文档https://jquery.com/

var demoName1 = "Peter Stone";
function showMessage() {
    var input = $('#inputText').val();
    $('.nameSend').html(demoName1 + input);

var a = new Date();
    var b = a.getHours();
    var c = a.getMinutes();
    if (c < 10) {
        c = "0" + c;
    }
    var time = b + ':' + c;

    $('#messageBoxSend').append(time);
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" id="inputText">
<div id="messageBoxSend">
<div class="nameSend"></div>
</div>
<div class=""></div>
<button onclick="showMessage();">Click me!</button>

阅读评论和您的问题后，我意识到应该解决安全问题。建议在使用innerHTML()之前清理HTML。

您可以在https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/Safely_inserting_external_content_into_a_page

上阅读有关创建DOM元素和安全使用innerHTML()的更多信息。

如何用jQuery替换innerHTML？

3 个答案: