当前位置：首页 > news >正文

小红书改版后发布按钮抓不到？两个思路绕开Shadow DOM限制

news 2026/5/27 22:53:48

最近在影刀社区看到一个哥们的求助帖，问题是这样的：

"小红书发布笔记-无法定位发布按钮，只能定位上一级。前段时间可以，改版后我发现不能定位，请问这种情况怎么解决呢？"

这个问题看起来很具体，但仔细想想挺有意思的——一个普通的发布按钮，怎么突然就找不到了？

一查才发现，小红书玩儿了个花活。

它们把"发布"按钮包裹在 template shadowrootmode="closed" 标签中，属于封闭的 Shadow DOM 节点，这导致影刀 RPA 无法正常捕获发布按钮元素。具体看一下源码：

<xhs-publish-btn data-v-04842b33="" data-v-74e5df5a-s="" is-publish="true" is-save-draft="true" submit-text="发布" save-text="暂存离开" submit-disabled="false" save-disabled="false" uia-uid="0|1">
  <template shadowrootmode="closed">
    <style>
      /\* 一堆样式 \*/
    </style>
    <div data-v-app="">
      <div class="publish-page-publish-btn">
        <button type="button" class="ce-btn white">暂存离开</button>
        <button type="button" class="ce-btn bg-red">发布</button>
      </div>
    </div>
  </template>
</xhs-publish-btn>

Shadow DOM 这个技术，说白了就是一个隔离机制。它能在普通 DOM 树之外挂一个完全独立的内部 DOM，外面的玩意进不去，里面的也出不来。

XPath 顺着树往下走，碰到 xhs-publish-btn 这一层就直接"撞墙"了。浏览器在底层把这条路封死了，里面的 button class="ce-btn bg-red" 标签，XPath 根本看不见。

这是 Web 标准的一个设计，用来防攻击、防爬虫、防止自动化脚本随意点击。但这对做自动化的人来说，就成了一道坎儿。

有些朋友直接卡在这里——前面的流程全自动化了，最后一步点不动，流程中断，很窝火。

好在这事儿有解。今天介绍两个思路，第一种是影刀社区?? DC 哥??分享的，第二种是我自己的思路。两个都实测能跑通。

第一招：原型链劫持 — 油猴

原理很简单，小红书在建立 Shadow DOM 的时候会调浏览器的 attachShadow 方法，传入 { mode:closed} 让浏览器封死内部。

我们提前在这个方法上做手脚，把参数强行改成 {mode:open} ，浏览器就开门了。

怎么操作呢。不复杂。

1. 浏览器装油猴扩展。浏览器扩展商店搜 Tampermonkey，装上。

2. 装好以后点击油猴图标，选「创建新脚本」或「新增脚本」，把这段代码复制进去：

// ==UserScript==
// @name         强制Shadow DOM为open模式
// @match        \*://\*/\*
// @grant        none
// ==/UserScript==(function() {
    'use strict';
    Element.prototype.\_attachShadow = Element.prototype.attachShadow;
    Element.prototype.attachShadow = function(option) {
        return this.\_attachShadow({ mode: 'open' });
    };
})();

3. 保存脚本。然后去小红书刷新页面。完。