当我打开 Facebook 的messenger.com并document.getElementsByClassName('_1htf')[2].click();
在控制台中运行时,它会跳转到对话并打开它。_1htf
是我选择的一个随机类,每个对话条目都包含这个类。
在web.whatsapp.com上做同样的事情来访问对话,没有任何反应。我什至无法click()
使用该网站上的“真实”按钮。
我真的不明白为什么这适用于第一个网站,但不适用于第二个网站。
我能够指出的网站之间有两个区别:
web.whatsapp.com
阻止浏览器的鼠标右键上下文菜单并用自定义菜单覆盖它 -messenger.com
不这样做messenger.com
的_1htf
元素包含一个URI
导致对话的元素(您可以在新选项卡中打开 uri 并最终进入对话) -web.whatsapp.com
的元素不包含链接,但在单击时仍以某种方式打开对话
这是如何实现的?是否有一些 Javascript 监听鼠标事件?如果是这样,我该如何触发事件?我真的需要以编程方式“点击”对话。
这是一个对话条目的外观web.whatsapp.com
<div class="infinite-list-item infinite-list-item-transition" style="z-index: 200; height: 72px; transform: translateY(144px);">
<div tabindex="-1" class="chat-drag-cover">
<div class="active chat hover">
<div class="chat-avatar">
<div class="avatar icon-user-default">
<div class="avatar-body" style="cursor: pointer;"><img src="https://dyn.web.whatsapp.com/pp?t=s&u=4 . . . " draggable="false" class="avatar-image is-loaded"></div>
</div>
</div>
<div class="chat-body">
<div class="chat-main">
<div class="chat-title"><span class="emojitext ellipsify" dir="auto" title="CONVERSATION PARTNER"><!-- react-text: 92 -->CONVERSATION PARTNER<!-- /react-text --></span></div>
<div class="chat-meta"><span class="timestamp">21:16</span></div>
</div>
<div class="chat-secondary">
<div class="chat-status"><span class="last-msg" title="CONVERSATION MESSAGE"><span class="emojitext" dir="ltr"><!-- react-text: 28843 -->CONVERSATION MESSAGE<!-- /react-text --></span></span>
</div>
<div class="chat-meta"><span></span><span></span><span class="context-container"><div data-icon="down" role="button" class="img btn-context" style="width: 20px; opacity: 1;"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 21 21" width="21" height="21"><path fill-opacity=".31" d="M4.8 6.1l5.7 5.7 5.7-5.7 1.6 1.6-7.3 7.2-7.3-7.2 1.6-1.6z"></path></svg></div></span></div>
</div>
</div>
</div>
</div>
</div>
更新:我试图触发 Chrome Dev Console > Elements > Event Listeners 中列出的众多事件,但这些似乎都不起作用,它只输出ƒ focus() { [native code] }
但不跳转到对话。
谢谢