javascript querySelectorAll（） - 方法

Question

私はこのコードを持っています。ステートメントの後でさえも、

curr_attr.value = 'display: block' ; 

が実行されます。しかし、それは2回目に働くが、それは作業と非作業の間で交代する。

function filterEntries() { 
      var selectedText = $("#search :selected").text(); 
      var enteredText = $("#txtSearchValue").val(); 
      enteredText = enteredText.split(" ").join(""); 

      var table; 
      var allPanels = $(".panel"); 

      console.log("allPanels.hide(2000); at line number 202"); 
      allPanels.hide(1000); 

      if (selectedText.toLowerCase() === 'band name') { 
       if (enteredText === '') { 
        // remove filter and show all elements 
        console.log("allPanels.show(); at line number 210"); 
        allPanels.show(1000); 
       } else { 

        //console.log("allPanels.show(); at line number 215"); 
        //allPanels.show(1000); 

        table = document.querySelectorAll("[data-searchband=" + CSS.escape(enteredText) + "]"); 

        for (var i = 0; i < table.length; ++i) { 
         // print the tag name of the node (DIV, SPAN, etc.) 
         var curr_node = table[i]; 
         console.log(curr_node.tagName); 

         // show all the attributes of the node (id, class, etc.) 
         for (var j = 0; j < curr_node.attributes.length; ++j) { 
          var curr_attr = curr_node.attributes[j]; 
          console.log(curr_attr.name, curr_attr.value); 
          if (curr_attr.name === 'style') { 
           curr_attr.value = 'display: block' ; 
          } 
         } 
        } 
       } 
      else { 
       alert("Please select a search criteria"); 
      } 

     } 

<div class="row"> 
     <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12"> 
      <select id="search" class="navbar-inverse small" name="search" onchange="searchFilters()"> 
       <option value="-1">Search Criteria</option> 
       <option value="band">Band Name</option> 
       <option value="title">Content Title</option> 
      </select> 
      &nbsp; 
      <input type="text" class="small" id="txtSearchValue" placeholder="Search for..."> 
      &nbsp; 
      <span id="btnSearch" onclick="filterEntries()" class="btn btn-default btn-sm">Search</span> 
     </div> 
    </div> 

Answer 1

あなたはcurr_node.style.display = 'block'を使用することができます。

たとえばコンソールdocument.body.style.display = 'none'を入力し、その効果を確認します。

Answer 2

問題はhideとshowです。私はhide（2000）とshow（）を使っていました。 hide（）をhide（）に置き換えると、hide（）が機能し始めました。私は、アニメーションがshow（）またはdisplay = blockでうんざりしていたと思います。 Hide（）で置き換えられたhide（2000）では、display =ブロックが完全に機能します。皆さんありがとう！