直到最近,我的 Chrome 扩展程序才能通过内容脚本找到并以编程方式单击在 Google 文档(在编辑模式下)中突出显示文本后出现的“新评论”按钮。
这是突出显示时出现的按钮:
<div id="docs-instant-button-bubble" class="docs-material docs-instant-
button-bubble-transformation-ltr docs-instant-button-visible" instant-
role="button" tabindex="-1" aria-hidden="true" aria-label="Add a instant-
comment" data-tooltip="Add a comment" style="top: 352.8px; opacity: 1; instant-
background-color: red;"><div class="docs-instant-button-bubble-icon-instant-
container"><span class="docs-instant-button-bubble-icon docos-icon-img instant-
docos-icon-img-hdpi docos-instant-icon-img docos-icon-instant-docos-ltr instant-
docos-instant-button-bubble-icon"></span></div></div>
我的代码仍然“看到”这个元素 - 如果我愿意,我可以把它变成红色。
但是我用来创建“点击”的点击处理程序不再起作用。这是简单的js:
document.getElementById("docs-instant-button-bubble").click();
Google Docs(对此元素)中的哪些更改使我的程序化点击失败?
预先感谢您的任何指导/帮助!
从这个答案:
试试这个代码;它通过在按钮中心触发的快速连续的 mousedown、mouseup 和 click 事件模拟鼠标左键单击元素:
var simulateMouseEvent = function(element, eventName, coordX, coordY) {
element.dispatchEvent(new MouseEvent(eventName, {
view: window,
bubbles: true,
cancelable: true,
clientX: coordX,
clientY: coordY,
button: 0
}));
};
var theButton = document.querySelector('ul form button');
var box = theButton.getBoundingClientRect(),
coordX = box.left + (box.right - box.left) / 2,
coordY = box.top + (box.bottom - box.top) / 2;
simulateMouseEvent (theButton, "mousedown", coordX, coordY);
simulateMouseEvent (theButton, "mouseup", coordX, coordY);
simulateMouseEvent (theButton, "click", coordX, coordY);
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句