1.背景与问题
1.背景
页面中表格有60多条数据，在不做分页处理的情况下，设置表格的最大高度，展示滚动条。
2.问题
在对前二十条已经展示在页面上的数据进行操作时，没有问题。滚动表格展示出新数据时，对数据进行操作，会有如图报错。并且对于新数据的操作并不生效。
2.aria-hidden属性
1.原理
-
影响焦点的管理：当元素被设置为
aria-hidden="true"时，不仅是屏幕阅读器，键盘用户也将无法与该元素交互（例如，不能聚焦或触发事件）。因此，在隐藏元素时需要特别注意焦点管理，避免将焦点置于不可访问的元素上。 -
继承特性：如果某个元素设置了
aria-hidden="true"，它的所有子元素也会被隐藏。换句话说，设置了该属性的父元素会将此状态传递给其子元素。你可以通过为特定的子元素重新设置aria-hidden="false"来覆盖父元素的隐藏行为。
aria-hidden="true" // 元素及其子元素对辅助技术不可见
aria-hidden="false" // 元素对辅助技术可见
<div aria-hidden="true">
<p>这段文字将被屏幕阅读器忽略</p>
<p aria-hidden="false">但这段文字会被屏幕阅读器读取</p>
</div>
2.功能和用途
aria-hidden是一个控制元素是否被辅助技术（如屏幕阅读器）访问的属性。aria-hidden="true"使元素不可被读取和交互。aria-hidden="false"（或未设置此属性）使元素对辅助技术可见。- 它可以用来隐藏视觉上不需要的元素，改善无障碍体验，但需要谨慎使用，避免与焦点管理或交互行为冲突。
3.解决方法
可见出现此种报错，可能是因为该元素或其某个祖先元素上设置了 aria-hidden="true"，导致其不可进行交互。
更改aria-hidden属性
aria-hidden="false" // 元素对辅助技术可见动态控制 aria-hidden
if (elementIsVisible) {
element.removeAttribute('aria-hidden');
} else {
element.setAttribute('aria-hidden', 'true');
}