Javascript 如何简化此代码？我会在单击时显示1个div并隐藏其他div

如何简化此代码？我会在单击时显示1个div并隐藏其他div

我这样做是为了十个或更多的div。。。如何简单地编写代码

HTML

<div id="div1"><p>div1</p></div>

<div id="div2"><p>div2</p></div>

<div id="div3"><p>div3</p></div>

<div id="parte1"></div>

<div id="parte2"></div>

<div id="parte3"></div>

---

您可以将它们全部更改为同一类，然后使用：

$(".class").click(function(){

    $(".class").not($(this)).hide();

});

---

这可能会起作用，或者类似的东西。您可以将html更改为如下内容

演示

HTML

---

实际上，您可以解析parte id并获取索引，但使用data num，您可以更改id或根本不使用它们

使用类而不是id来开始您的代码似乎。。。相当“简单”的说法可能是错误的，但您的代码似乎不起作用。对于10个或更多的div，该怎么办？始终显示问题中的所有相关代码和标记，而不仅仅是链接。链接会腐烂，人们不应该离开网站去帮助你。

$(".class").click(function(){

    $(".class").not($(this)).hide();

});

<div id="div1" class="div"><p>div1</p></div>

<div id="div2" class="div"><p>div2</p></div>

<div id="div3" class="div"><p>div3</p></div>

<div class="parte" id="parte1" data-num="1"></div>

<div class="parte" id="parte2" data-num="2"></div>

<div class="parte" id="parte3" data-num="3"></div>

$(".parte").on('click', function() {
    var n = $(this).data('num');
    $('.div').fadeOut();
    $('.div').eq(n-1).fadeIn(100);  
});