Question

我们的桌子在移动设备上看起来不太好。我发现并实现了一个很棒的脚本，该脚本使表具有响应性，而无需编辑数十个页面和表ID即可触发。但是，我不想修改一个特定的表<table id="amazon-polly-audio-table">，因为格式已经响应。它还提供了一个未捕获的错误。如何排除表ID？谢谢。

/* Credits:
	This bit of code: Exis | exisweb.net/responsive-tables-in-wordpress
	Original idea: Dudley Storey | codepen.io/dudleystorey/pen/Geprd */
  
var headertext = [];
var headers = document.querySelectorAll("thead");
var tablebody = document.querySelectorAll("tbody");

for (var i = 0; i < headers.length; i++) {
	headertext[i]=[];
	for (var j = 0, headrow; headrow = headers[i].rows[0].cells[j]; j++) {
	  var current = headrow;
	  headertext[i].push(current.textContent);
	  }
} 

for (var h = 0, tbody; tbody = tablebody[h]; h++) {
	for (var i = 0, row; row = tbody.rows[i]; i++) {
	  for (var j = 0, col; col = row.cells[j]; j++) {
	    col.setAttribute("data-th", headertext[h][j]);
	  } 
	}
}

Answer 1

您可以尝试将\documentclass{article} \usepackage{amsmath} \begin{document} \[ 1 + \frac{1}{2 + \frac{1}{3 + \frac{1}{1 + x}}} \] \[ 1 + \dfrac{1}{2 + \dfrac{1}{3 + \dfrac{1}{1 + x}}} \] \[ 1 + \cfrac{1}{2 + \cfrac{1}{3 + \cfrac{1}{1 + x}}} \] \end{document}添加到id和thead，然后使用tbody选择器

not

Answer 2

您可能会发现将来希望对其他表重复此行为，因此请考虑使用“ ignoreResponsive”之类的类并将其添加到表中，而不仅仅是定位特定的元素ID。

<table class="ignoreResponsive">

然后在脚本中添加一个新的选择器，以仅获取不具有该类的表。

/* Credits:
	This bit of code: Exis | exisweb.net/responsive-tables-in-wordpress
	Original idea: Dudley Storey | codepen.io/dudleystorey/pen/Geprd */
  
var headertext = [];
var headers = document.querySelectorAll("thead");
var tablebody = document.querySelectorAll("tbody");

/* selector to get just the tables without the class ignoreResponsiove */
var tables = document.querySelectorAll("table:not(.ignoreResponsive"));

/* wrap whole thing in loop that just does tables you want from the selector */
for (var i = 0; i < tables.length; i++) {

  for (var i = 0; i < headers.length; i++) {
    headertext[i]=[];
    for (var j = 0, headrow; headrow = headers[i].rows[0].cells[j]; j++) {
      var current = headrow;
      headertext[i].push(current.textContent);
      }
  } 

  for (var h = 0, tbody; tbody = tablebody[h]; h++) {
    for (var i = 0, row; row = tbody.rows[i]; i++) {
      for (var j = 0, col; col = row.cells[j]; j++) {
        col.setAttribute("data-th", headertext[h][j]);
      } 
    }
  }
  
}

运行响应表脚本时如何忽略特定的表ID

2 个答案: