Javascript 显示由“隐藏”隐藏的div；显示：无“；使用JS？

下面的HTML和JavaScript按预期工作，但我想确保我正确使用了它

我有两个div，但根据

模式的值，只需要显示一个div

HTML:

这给了我预期的结果。是否有更好的方法反转
style=“display:none”
属性？
您可以使用：

$("#a-div").toggle();

或者

.show（）
/
.hide（）


.fadeIn（）
/
fadeOut（）
您需要修改内联样式属性的显示属性

像这样

var mode = 'add';

if (mode === 'add') {
    $("#a-div")[0].style.display = 'block';
} else {
    $("#d-div")[0].style.display = 'block';
}

或者您可以使用类似于
inherit
的方法来代替
block
有几种方法可以做到这一点（就像您在其他答案中看到的那样），但我认为
show（）
函数就足够了，可以在您的情况下完成工作

您还可以使用JQuery的
css（）
方法，如下所示：

$("#a-div").css('display','block');

希望这能有所帮助。
您当前的代码应该运行良好，但有很多方法可以解决此问题。我建议使用jQuerys：

或者，您可以给他们id
adddiv
和
delete div
，并使其中一个可见，如下所示：

$("#" + mode + "-div").show();

另一个选项是将样式移动到css：

html:

脚本：

$("#a-div").addClass("notDisplayed");
$("#d-div").removeClass("notDisplayed");

此方法比显示/隐藏更通用，因为它可以扩展到任何样式规则。
为什么您的代码中有“智能引号”
'
，而不是直接引号：
'
？您肯定做得对
show（）
是为这样的工作而设计的。@Xufox我在word文档中编写了这个示例代码（错误的选择）。你不能使用
。style
与jQuery对象一起使用，你必须使用
.css（）
。是的，你可以。对象的第一项是一个元素，就像
document.getElementById（）
将为您提供的一样。在我看来，所有其他函数都会做更多不必要的工作。在我写评论时，您没有
[0]
。这将返回jQuery对象中包含的DOM对象，因此当然可以使用DOM属性。为什么需要显式地将
display
设置为
block
？不只是像最初的问题那样调用
show（）
就够了吗，或者我在这里遗漏了什么吗？@Barmar您暗示不可能完全使用jQuery的
$（）
函数。我打错了，没什么大不了的。重要的是有可能。使用显示器总是一个好主意：无。否则，当页面加载时，但在document.ready事件触发并隐藏内容之前，您经常会看到内容在屏幕上闪烁。
$("#a-div").toggle(mode === "add");
$("#a-div").toggle(mode === "delete");

$("#" + mode + "-div").show();

    <div id="a-div" class="notdisplayed">
        <button id="add" class="btnstyle">Add </button>
    </div>
    <div id="d-div" class="notdisplayed">
        <button id="delete" class="btnstyle">Delete</button>
    </div>

.notDisplayed {display:none;}

$("#a-div").addClass("notDisplayed");
$("#d-div").removeClass("notDisplayed");