如何找到执行此操作的JS函数？

Question

出于学习目的，我正在使用网络版本的Whatsapp（https://web.whatsapp.com/）进行一些测试。我发现，当我在文本框中键入表情符号快捷方式时，应用程序会自动将其更改为对应的表情符号。例如，如果我输入

（y）

它将替换为

我正在尝试学习以改善我的JS技巧是：如何找出正在执行此操作的函数以及如何手动调用该函数。

我试图在Devtools上找到它，但找不到。

有什么想法吗？

谢谢

Answer 1

我正在回答您的问题，以确定可能导致DOM更改的原因。我没有回答您有关实际上是什么原因引起的变化的衍生问题。

利用浏览器的devtools。您可以中断对DOM元素的更改。您已经标记了google-chrome-devtools，因此请继续以下示例：

1. 导航到“元素”面板
2. 右键单击要监视的元素
3. 点击“中断→修改子树”
4. 触发更改
5. 然后您将在“源”面板中看到一个主动断点，以了解引起修改的任何代码
6. 从那里导航调用堆栈，直到找到所需级别的函数为止