HTML5訪問完整列以通過javascript/jquery隱藏它

如果我必須隱藏一個完整的列（1 TH和多個TD）如何在HTML 5中執行此操作？HTML5訪問完整列以通過javascript/jquery隱藏它

在過去，我使用「名稱」在那裏命名所有列，我希望能夠隱藏在一個相同的迭代document.GetElementsByName("MyColumnName")，然後設置顯示爲無。

這是如何在HTML5中完成的，因爲Name屬性不再適用於th或td。

來源

2014-07-07 Thomas

使用css類是很常見的做法。使用document.getElementsByClassName或jQuery：$（「。my-class」）... – Esko

您仍然可以使用特定的id或類名遍歷th的所有實例。當使用jQuery來做這個更好的選擇時，你仍然可以使用name標籤並通過標籤名稱來遍歷元素。

一些例子是：

HTML：

<td class="foo"></td> 
<td id="foo"></td>

使用jQuery：

// get element by class name 
$(".foo").each(function(){ 
    $(this).css("display", "none"); 
}); 

// get element by id 
$("#foo").each(function(){ 
    $(this).css("display", "none"); 
});

使用JavaScript：

// get by class name 
var foo = getElementsByClassName("foo"); 

for(var i = 0; i < foo.length; i++) { 
} 

// get by id 
var foo = getElementById("foo"); 

for(var i = 0; i < foo.length; i++) { 
}

完整的示例：

建議您使用class名稱，而不是id作爲id應始終是唯一的，而有可能是class名稱的多個實例。

<html> 
    <body> 
     <table> 
      <th></th> 
      <td class="foo"></td> 
      <td class="foo"></td> 
      <td class="foo"></td> 
     </table> 
    </body> 

    <script> 
     $(document).ready(function() { 
      $(".foo").each(function(){ 
       $(this).css("display", "none"); 
      }); 
     }); 
    </script> 
</html>

來源

2014-07-07 14:18:57 Nicolas

使用id屬性和document.getElementById('idOfElement')函數，它返回元件（未數組）具有指定ID。或class屬性和document.getElementsByClassName('myClassName')，它返回類屬性等於'myClassName'的元素。

來源

2014-07-07 14:19:41

有多種方法可以選擇某個元素。假設TH在表中的第三TH，你可以通過

document.querySelector("th:nth-of-type(3)")

選擇它，然後應用的style.display ......它。但沒有標記，很難給出明確的答案。

來源

2014-07-07 14:21:03 SVSchmidt

HTML5訪問完整列以通過javascript/jquery隱藏它

回答

相關問題