CasperJS点击特定按钮失效问题求助

我之前也踩过这个坑，你遇到的问题根源其实是CSS选择器的语法限制在搞鬼。

问题拆解 #

你要点击的按钮HTML结构是这样的：

<button class="add-subscription button middle" id="2">Choose</button>

不管你用#2还是button#2.add-subscription.button.middle这类选择器都无效，连Resurrectio都记录不了点击——核心原因是：CSS规范里，标识符（包括ID选择器）不能以数字开头，直接写#2属于不符合语法的写法，CasperJS底层的选择器引擎根本没法正确解析它。

可行解决方案 #

你已经找到的这个写法完全正确：

this.click('[id="2"]');

用属性选择器来定位ID为"2"的元素，绕开了CSS选择器对标识符开头的限制，能被CasperJS正常识别执行。

另外还有一个更直接的替代方案，直接在页面上下文里用原生JS的getElementById方法，因为原生方法不受CSS选择器规则约束：

this.evaluate(function() {
    document.getElementById('2').click();
});

额外小建议 #

1. 执行点击前可以先验证元素是否存在，避免因元素未加载完成导致的失败：

if (this.exists('[id="2"]')) {
    this.click('[id="2"]');
} else {
    this.echo('目标按钮未找到');
}

2. 确保waitUntilVisible等待的元素确实覆盖了目标按钮的加载周期，有时候页面结构加载完成但按钮可能还没完全可交互，可以尝试增加等待时间或者改用waitUntilExists来等待元素存在。

内容的提问来源于stack exchange，提问作者open-ecommerce.org