<div role="radiogroup" class="radio-group">
<label role="radio" aria-checked="true">
<span class="radio__input is-checked">
// 省略里面的内容
</span>
<span class="radio__label">备选项 1 </span>
</label>
<label role="radio">
<span class="radio__input">
// 省略里面的内容
</span>
<span class="radio__label">备选项 3 </span>
</label>
<label role="radio">
<span class="radio__input">
// 省略里面的内容
</span>
<span class="radio__label">备选项 3 </span>
</label>
</div>
如上 html 结构,现在想用 css 选择器实现选中当前被 checked 项中的文本 span 标签,即上面 备选项 1、备选项 2、备选项 3
对应 3 个 span
当前被 checked 的项会在给当前 lable 标签添加一个aria-checked="true"
属性,所以我现在可以通过label[aria-checked="true"]
选中被 checked 的 lable
需要选中的 span 是 lable 的第二个子元素,用nth-child(n)
不行,nth-child(n)是选择属于其父元素的第 n 个子元素的每个标签元素
直接通过span[class="radio__label"]
试了也不能选中所有 span
通过 jsdocument.getElementsByClassName("el-radio__label")
倒是可以选中所有的 span 标签,css 选择器如何实现呢?
客串前端,名次或术语用的不对的还请各位见谅!
这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。
V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。
V2EX is a community of developers, designers and creative people.