Question

代码：纯Javascript

术语：抽象：最低级别的抽象，最简单的代码，算法是我需要基于的东西，没有可见的逻辑连接

请向我解释1：如何使用算法-隐藏并显示多格div＃隐藏并显示3格

问题：如何从下面的代码使用显示和隐藏（切换）多个div用于算法？请给我jsfiddle。

代码：

<div id="first">first</div>
<div id="second">second</div>
<a href="javascript:HideContent(['first','second'])"> ENGLISH</a>
<script>
  function HideContent(obj) {
    for (var i = 0; i < obj.length; i++) {
      document.getElementById([obj[i]]).style.display = 'none';
    }
  }
</script>

Simillar码，首选方法：

<!doctype html>
<html>

<head>
    <meta charset="UTF-8" />
    <title>Nazwisko</title>
    <meta name="keywords" content="Twoje, słowa, kluczowe," />
    <meta name="description" content="Wstaw opis swojej strony" />
    <meta name="author" content="Nazwisko" />
    <script type="text/javascript">
        function switchVisible() {
            if (document.getElementById('Div1')) {

                if (document.getElementById('Div1').style.display == 'none') {
                    document.getElementById('Div1').style.display = 'block';
                    document.getElementById('Div2').style.display = 'none';
                    document.getElementById('Div3').style.display = 'none';
                }
                else {
                    document.getElementById('Div1').style.display = 'none';
                    document.getElementById('Div2').style.display = 'block';
                    document.getElementById('Div3').style.display = 'block';
                }
            }
        }
    </script>

    <style type="text/css">
        #Div2 {
            display: none;
        }
    </style>
</head>

<div id="Div1">Div 1</div>
<div id="Div2">Div 2</div>
<input id="Button1" type="button" value="Click" onclick="switchVisible();" />
<br />
Wthout Position.absolute ?????
<div id="Div1a">Div 1</div>
<div id="Div2a">Div 2</div>

Download

说明：这是对答案的问题 Hide Multiple Elements in html using javascript 代码段无效，有人可以给我工作代码段并进行解释

个人，条件：我讨厌javascript...。但是我喜欢html。我真的很顽固地编写代码，每次都会出现故障。对不起，如果我还是重复一些东西，请保留空间，请尽可能给我外部文件。

Answer 1

您应该先检查样式的当前显示属性，然后将其相应更改为none或block

<div id="first">
  first</div>
<div id="second">second</div>

<a href="javascript:HideContent(['first','second'])"> ENGLISH</a>
<script>
  function HideContent(obj) {
    for (var i = 0; i < obj.length; i++) {
      var currentStyle = document.getElementById([obj[i]]).style.display
      if (currentStyle === 'none') {
        document.getElementById([obj[i]]).style.display = 'block'
      } else {
        document.getElementById([obj[i]]).style.display = 'none'
      }
    }
  }

</script>

算法javascript-隐藏并显示3、4个div，隐藏多个元素

Download

1 个答案: