如何让我的元素在 Vimium 中可点击？

Question

我在 Firefox 和 Chrome 上使用 Vimium，它对我帮助很大 https://github.com/philc/vimium

我注意到有些div可以点击，我发现class='demo-button'是其中之一

<div class='demo-button'>demo-button</div>
<div class='demobutton'>demobutton</div>
<div class='demobuttonnn'>demobuttonn</div>
<div class='demobutto'>demobutto</div>

这里是 Vimium 链接的截图https://jsfiddle.net/qnvujfs6/

如你所见，只有最后的div demobutto不能用Vimium点击。我试图在 Vimium 源中搜索 demo-button 或 demobutton 但没有结果。

有谁知道为什么这个演示按钮 div-s 之间存在差异？

我希望能够使用 bootstrap 插件点击一些生成的元素，例如 Bootstrap Toggle。这是两个切换的代码，但只能点击第二个，因为它包含 demo-button class

https://codepen.io/duleorlovic/pen/VqWaEg

Answer 1

前三个是可点击的，因为 class 属性包含单词 "button" (See source)。

出于可用性目的，它更喜欢简单地使用旨在完成该工作的元素。例如锚点（<a>）和按钮（<button>）。

但如果这不可能（这里似乎就是这种情况），您还可以将 role 属性添加到元素。具有以下值之一的属性 role 的元素也将被视为可点击：

按钮
选项卡
link
复选框
菜单项
菜单项复选框
菜单收音机

(Source)

因此，如果您的 div 元素代表复选框，您的代码将如下所示：

<div class="demo-button" role="checkbox">demo-button</div>
<div class="demobutton" role="checkbox">demobutton</div>
<div class="demobuttonnn" role="checkbox">demobuttonn</div>
<div class="demobutto" role="checkbox">demobutto</div>

在这种情况下，您不依赖于特定的 class 名称，which are by the extension considered "as unreliable"。

如何让我的元素在 Vimium 中可点击？

How can I make my element clickable for Vimium?

html

vimium