和
点击范围自定义：细节和概要
在 html 中，
问题详情
一位开发者希望构建一个类似树形表的内容，但希望只能通过点击行最前面的图标来显示或隐藏内容，而非整行可点击。
解决方案
调整 和 元素的 css 和事件处理代码可以实现此目标。
在
.tree summary::before {
position: relative;
z-index: 2;
cursor: pointer;
}
.tree summary span::before {
content: '';
position: absolute;
left: 0;
right: 0;
height: 46px;
}
.tree summary span {
pointer-events: none;
}tree.addEventListener('click', function(ev) {
if (ev.target.tagName === 'SPAN') {
ev.preventDefault();
}
});css 代码提高了图标（ 元素）的层级，使其位于其他内容之上，并阻止 元素上的点击事件传播到
此解决方案使点击图标能够展开或关闭内容，同时阻止点击行中的其他区域。
