如何用CSS选择器定位含指定文本行内的目标A元素？

首先纠正一个小误区：CSS原生并没有[Text$='xxx']这种属性选择器语法，要匹配文本内容得用:contains()伪类（注意兼容性），或者结合父元素筛选。

针对你的需求，有两种可行的选择器写法：

方法1：利用兄弟选择器直接关联 #

#myId td:nth-child(1):contains('- date1end') + td + td a

拆解说明：

• #myId：精准定位到目标表格
• td:nth-child(1):contains('- date1end')：选中第一列里包含- date1end文本的单元格
• + td + td：选择该单元格右侧的第二个同级<td>（第一个+ td是中间的"not interesting"单元格，第二个+ td就是包含链接的单元格）
• a：最终选中该单元格内的<a>元素

方法2：通过父行<tr>筛选（更清晰） #

如果你的环境支持CSS Selectors Level 4的:has()伪类（比如Chrome DevTools、新版浏览器），可以先定位到目标行，再找里面的链接：

#myId tr:has(td:nth-child(1):contains('- date1end')) td:nth-child(3) a

拆解说明：

• tr:has(td:nth-child(1):contains('- date1end'))：筛选出包含目标<td>的行
• td:nth-child(3) a：直接选中该行第三列里的<a>元素

注意兼容性 #

• 原生CSS目前还不支持:contains()，如果是在原生JavaScript环境中，你可能需要先用querySelectorAll获取所有行，再通过文本内容筛选；或者借助jQuery（jQuery对:contains()有良好支持）。
• :has()伪类在现代浏览器中已经逐步支持，但旧版浏览器可能无法识别。

内容的提问来源于stack exchange，提问作者tonsteri