HTML DOM中如何用querySelector筛选指定data属性的按钮并点击？

解决方案 #

直接使用CSS原生属性选择器匹配目标data-original-title属性即可，单行实现代码如下：

document.querySelector('button.btn.btn-default.flag-item[data-original-title="Allowed to log into the Main Tools."]').click();

说明 #

• 选择器中[data-original-title="xxxx"]是CSS标准属性匹配规则，可以直接筛选出带有指定data-*属性和对应值的元素，无需先选中所有按钮再遍历过滤
• 该选择器不依赖元素的层级位置，只要目标按钮的类属性和data-original-title属性值不变，动态渲染场景下也可以正常匹配到元素
• 兼容所有现代浏览器，完全适配UiPath调用JS脚本的场景

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