Javascript 一个HTML页面中的多个选项卡没有唯一引用（没有ID或类）

是否可能在一个HTML页面中有多个选项卡，而没有唯一的引用，即没有ID或类作为单击选项卡时显示内容的引用。下面的代码只是将其形象化。它是纯CSS，使用ID。在一个HTML页面中应显示多个带有选项卡的此类部分。代码应该在没有任何手动预定义内容的情况下工作，因为这个带有选项卡的代码模式应该在多个HTML页面上重复使用多次，因此，它应该是通用的。我在考虑一个可能的解决方案，使用JS和nextElementSibling之类的工具。任何人都可以支持并发布解决方案（不一定在示例中；理想情况下是纯JS，没有库）

正文{
背景：#e0；
}
* {
过渡：0.5s缓进缓出；
框大小：边框框；
}
.手风琴{
利润率：94px自动0自动；
最大宽度：500px；
高度：300px；
位置：相对位置；
}
.手风琴输入.tab-toggle{
位置：绝对位置；
不透明度：0；
}
.手风琴输入.选项卡切换：选中+标签{
背景：白色；
}
.手风琴输入.选项卡切换：选中+标签.选项卡标题：悬停{
背景：透明；
}
.手风琴输入.选项卡切换：选中+标签.选项卡{
能见度：可见；
不透明度：1；
}
.手风琴标签{
浮动：左；
字体大小：16px；
线高：16px；
边界半径：3px3px0；
}
.手风琴标签：类型的第一个.tab{
边界半径：0 3px 3px 3px；
}
.手风琴标签.标签标题{
显示：块；
填充：20px；
边界半径：3px3px0；
}
.手风琴标签.选项卡标题：悬停{
光标：指针；
背景：rgba（0,0,0,0.1）；
}
.手风琴{
可见性：隐藏；
不透明度：0；
位置：绝对位置；
填充：20px；
顶部：56px；
左：0；
最小宽度：100%；
高度：244px；
背景：白色；
边界半径：3px；
}

Lorem ipsum dolor sit amet，是一位杰出的献身者。佩伦特式的猫咪，贪婪的猫咪，温文尔雅的法雷特拉·梅特斯。在ullamcorper的Donec viverra accumsan velit。

表一
嗨。我很满意。很高兴认识你

表二
嗨。我是tab 2的内容。很高兴认识你

表三
嗨。我是tab three的内容。很高兴认识你

表四
嗨。我是四号标签的内容。很高兴认识你


Lorem ipsum dolor sit amet，是一位杰出的献身者。佩伦特式的猫咪，贪婪的猫咪，温文尔雅的法雷特拉·梅特斯。在ullamcorper的Donec viverra accumsan velit。

表五
表五

表六
六

表七
七

表八
八

如果将单选按钮插入

中，则无需使用ID：

正文{
背景：#e0；
}
* {
过渡：0.5s缓进缓出；
框大小：边框框；
}
.手风琴{
利润率：94px自动0自动；
最大宽度：500px；
高度：300px；
位置：相对位置；
}
.手风琴输入.tab-toggle{
位置：绝对位置；
不透明度：0；
}
.手风琴标签输入.选项卡切换：选中+.选项卡标题{
背景：白色；
}
.手风琴标签输入.选项卡切换：选中~.选项卡{
能见度：可见；
不透明度：1；
}
.手风琴标签{
浮动：左；
字体大小：16px；
线高：16px；
边界半径：3px3px0；
}
.手风琴标签：类型的第一个.tab{
边界半径：0 3px 3px 3px；
}
.手风琴标签.标签标题{
光标：指针；
显示：块；
填充：20px；
边界半径：3px3px0；
}
.手风琴标签.选项卡标题：悬停{
背景：rgba（0,0,0,0.1）；
}
.手风琴{
可见性：隐藏；
不透明度：0；
位置：绝对位置；
填充：20px；
顶部：56px；
左：0；
最小宽度：100%；
高度：244px；
背景：白色；
边界半径：3px；
}

Lorem ipsum dolor sit amet，是一位杰出的献身者。佩伦特式的猫咪，贪婪的猫咪，温文尔雅的法雷特拉·梅特斯。在ullamcorper的Donec viverra accumsan velit。

表一
嗨。我很满意。很高兴认识你

表二
嗨。我是tab 2的内容。很高兴认识你

表三
嗨。我是tab three的内容。很高兴认识你

表四
嗨。我是四号标签的内容。很高兴认识你


Lorem ipsum dolor sit amet，是一位杰出的献身者。佩伦特式的猫咪，贪婪的猫咪，温文尔雅的法雷特拉·梅特斯。在ullamcorper的Donec viverra accumsan velit。

表五
表五

表六
六

表七
七

表八
八

给定的CSS根本不依赖于

id

。已经重新开始了-usable@TJCSS没有，但是标签是由IDs.thx指定给单选按钮的！很有希望。一句话：然而，这种方式对我来说并不实用。可能存在的每个选项卡部分的第一个应可见/选中。这在本例中是不可能的，对吧，因为在一个部分中单击选项卡会影响其他部分？这是不应该的。每个部分应该相互独立（这就是为什么我认为基本示例有些不理想）。有什么想法吗？