Javascript 是否在html中显示jQuery变量？

我很难将jquery变量放入html标记中。由于某种原因，变量显示在我的div之外

我有以下代码：

<script>
    $(document).ready(function() {
        setInterval(function() {
            var sec = 30
            var timer = setInterval(function() { 
                $('#hideMsg span').html(sec--);
                if (sec == -1) {
                    $('#hideMsg').fadeOut('fast');
                    clearInterval(timer);
                } 
            }, 1000);
        }, 2000);
    });
</script>
<script>
    $(document).ready(function() {
        setInterval(function() {
            var randomnumber = '<div id="hideMsg"><span>30</span></div>';
            $('#warning_show').html('<div id="message_box2"><h23>Warning!</h23><p>Your account has been Inactive for some time. You will be logged out in  ' + randomnumber + ' seconds.</p><div class="boxclose" id="boxclose" onclick="this.parentNode.parentNode.removeChild(this.parentNode);">&#10006;</div></div>');
        }, 3000);
    });
</script>

<div id="warning_show"></div>

我想要的是：

_ _ _ _ _ _ _  _ _ _ _ _ _ _ _ _ _ _ _ _ _
|                                         |
|   Time runs out in 30 seconds           |
|_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _|

---

有人能告诉我哪里出了问题吗？

请仅使用span或将div与display:inline；一起使用

   var randomnumber = '<span id="hideMsg">30</span>';

var randomnumber='30'；

原因：div是元素的块类型，而span是内联的，它内联显示内容

---

由于div在默认情况下是显示块，所以它转到下一行

尝试使用span而不是div：

var randomnumber = '<span id="hideMsg"><span>30</span></span>';

---

使用

span

isntead

var randomnumber = '<span id="hideMsg"><span>30</span></span>';

---

主要的问题是，您将秒添加到的元素应该是内联的。但是，您可以大量改进此处的逻辑，以删除不必要的嵌套

setInterval

调用。试试这个：

<div id="warning_show">
    <div id="message_box2">
        <h23>Warning!</h23>
        <p>Your account has been Inactive for some time. You will be logged out in <span class="timeout-seconds"></span> seconds.</p>
        <div class="boxclose" id="boxclose">&#10006;</div>
    </div>
</div>

---

如果需要，可以通过jQuery创建HTML结构。

我已经为您修改了标题，因为这与AJAX无关。

var randomnumber = '<span id="hideMsg"><span>30</span></span>';

$('#hideMsg span').html(sec--);

<div id="warning_show">
    <div id="message_box2">
        <h23>Warning!</h23>
        <p>Your account has been Inactive for some time. You will be logged out in <span class="timeout-seconds"></span> seconds.</p>
        <div class="boxclose" id="boxclose">&#10006;</div>
    </div>
</div>