Question

我想执行以下操作：

如果时间在上午7点至下午12点（周一至周六）之间，则输出html代码，否则输出其他内容。

我目前正在尝试：（忽略代码中的时间，这只是出于测试目的-我仍然希望在上午7点至下午12点完成操作）

<script>
            var today = new Date()
var curHr = today.getHours()

if (curHr < 12) {
  phoneText .innerHTML="<div class='col-sm-6 col-md-3'><div class='support-box'><div class='icon green'><i class='fas fa-comments'></i></div><div class='details-holder'><div class='title'>Live Chat</div><a href='javascript:$zopim.livechat.window.show();' style='color:white;'>Start a live chat</a></div></div>";
} else if (curHr < 18) {
  phoneText .innerHTML="<div class='col-sm-6 col-md-3'><div class='support-box'><div class='icon green'><i class='fas fa-comments'></i></div><div class='details-holder'><div class='title'>Live Chat</div><a href='javascript:$zopim.livechat.window.show();' style='color:white;'>Start a live chat</a></div></div>";
} else {
  phoneText .innerHTML="<div class='col-sm-6 col-md-3'><div class='support-box'><div class='icon green'><i class='fas fa-comments'></i></div><div class='details-holder'><div class='title'>Live Chat</div><a href='javascript:$zopim.livechat.window.show();' style='color:white;'>Start a live chat</a></div></div>";
}</script>

然后我有<div id="phone"></div>

Answer 1

如果您应该在html var outpout = document.getElementById("phone")中为目标创建一个var并将其用于outpout.innerHTML。但是您不能在此处插入整个div。因此，您可以为每种情况在html中创建所有div，并将它们放在display : none中以将其隐藏在CSS中。然后，您将它们放入var divOne = document.getElementById = "div_hour_first_case"之类的js中，然后将divOne.style.display = "flex"放入您的if中以显示预期的div。

Answer 2

尝试一下

https://jsfiddle.net/opecmshb/2/

例如，我使用curHr = 11是因为在我的jsfiddle var curHr = today.getHours()中不起作用

根据用户的当前时间输出HTML

2 个答案: