gpt4 book ai didi

javascript - 如何在if语句中显示不同的HTML元素

转载 作者:行者123 更新时间:2023-11-28 18:13:37 26 4
gpt4 key购买 nike

您好,我是 HTML 和 JS 新手,因此想寻求一些帮助。这里我想根据 if 语句为 true 或 false 显示两个不同的 HTML 元素。然而,它不起作用。我可以寻求帮助吗? (:

<!DOCTYPE html>
<html>
<body>


<script>
if (!user) {
<h1> there is no user </h1>
} </script>


if (user) {
<button type="button">Click Me!</button>
} </script>


</body>
</html>

最佳答案

这是一个原生的 Javascript 替代方案

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<div id="content"></div>

<script>

var el = document.getElementById('content');
var content;

if (!user) {
content = '<h1>there is no user</h1>';
}
if (user) {
content = '<button type="button">Click Me!</button>';
}

el.insertAdjacentHTML('afterbegin', content);

</script>
</body>
</html>

除非定义了 user 变量,否则这不会按原样工作,但我假设您已经在运行时使用了它。

如果此 div 中有更多 html,您可以使用不同的插入位置,请参阅此处的相关文档:https://developer.mozilla.org/en-US/docs/Web/API/Element/insertAdjacentHTML

关于javascript - 如何在if语句中显示不同的HTML元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41126430/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com