如何利用油猴脚本点击react中dropdown的元素
类似于!(data/attachment/forum/202210/17/223046p0ahgwjl93wjs5jq.png)这种的ant selector（https://ant-design.gitee.io/components/select-cn/），想选中其中的任意一项，但是元素定位不到（flex布局），选择selector，然后click也不生效，想要问问大佬们有啥好的办法吗？试过类似于https://stackoverflow.com/questions/72525568/tampermonkey-automation-of-selecting-option-in-a-menu的方法，但是是针对input类型的，select类型的不太适用 const elmGetter = new ElementGetter();
async function selectItem(inputId, title) {
const input = await elmGetter.get('#' + inputId);
const select = input.parentNode.parentNode;
const mousedown = new Event('mousedown');
select.dispatchEvent(mousedown);
const prop = Object.keys(input).find(p => p.startsWith('__reactProps'));
select.onMouseDown(mousedown);
const option = await elmGetter.get(`#${inputId}_list + .rc-virtual-list `);
option.onClick();
}
selectItem('rc_select_1', 'Jack');
React事件触发：https://bbs.tampermonkey.net.cn/thread-1250-1-1.html
ElementGetter：https://bbs.tampermonkey.net.cn/thread-2726-1-1.html 这是假select，实际上是div，找到div点击就行
document.querySelector('.ant-select-item-option-content').click() steven026 发表于 2022-10-17 22:45
这是假select，实际上是div，找到div点击就行
我试了，但是没有点击的效果，加了sleep也不行，我想要的其实是点击之后选择其中的指定元素，大佬能帮忙再看看不 miaoxu 发表于 2022-10-18 10:33
我试了，但是没有点击的效果，加了sleep也不行，我想要的其实是点击之后选择其中的指定元素，大佬能帮忙 ...
!(data/attachment/forum/202210/18/103536y70d7ai5ayl722ya.png)
直接点的是jack元素
这不是原生的select，不要以select来理解，直接当div理解就行，找到下拉框选项的div，直接点击选项就行 steven026 发表于 2022-10-18 10:36
!(data/attachment/forum/202210/18/103536y70d7ai5ayl722ya.png)
直接点的是jack元素
大佬，我按照你的代码试了之后，还是没有啥变化，document.querySelector(".ant-select-selection-item").click()，页面原来是lucky还是lucky没有变成jack，就很奇怪，是我理解的有问题吗
cxxjackie 发表于 2022-10-18 13:04
React事件触发：https://bbs.tampermonkey.net.cn/thread-1250-1-1.html
ElementGetter：https://bbs.tamp ...
感谢大佬，因为用的是单位的网站，不方便截图，所以拿ant design的作为demo，我刚刚试了一下，能够点击，但是选中指定的还是有点问题。可能是我赋值不对。我在试试。 miaoxu 发表于 2022-10-18 15:16
感谢大佬，因为用的是单位的网站，不方便截图，所以拿ant design的作为demo，我刚刚试了一下，能够点击， ...
也有可能事件类型不一样，不一定是click，还有可能需要传参，这个页面不需要我就省略了，你可以打印一下option看看。 cxxjackie 发表于 2022-10-18 13:04
React事件触发：https://bbs.tampermonkey.net.cn/thread-1250-1-1.html
ElementGetter：https://bbs.tamp ...
```
大佬，分析页面元素有没有教程啊，我看了代码发现只针对我给的页面，用在实际项目就很难定位了。想问下，然后再重新挑战自己项目的定位。
一迁移就不会了，能说下怎么定位那个选项的元素吗，我在页面上选不到，也就不能用浏览器直接查找元素位置，把html保存下来之后，如上图所示，直接蒙圈了。他里面的不是div而是span，不知道该如何定位，
<div class="ant-select-tree-treenode" aria-hidden="true" style="position: absolute; pointer-events: none; visibility: hidden; height: 0px; overflow: hidden;">
<div class="ant-select-tree-indent">
<div class="ant-select-tree-indent-unit"></div>
</div>
</div>
<div class="ant-select-tree-list" style="position: relative;">
<div class="ant-select-tree-list-holder" style="max-height: 256px; overflow-y: hidden; overflow-anchor: none;">
<div>
<div class="ant-select-tree-list-holder-inner" style="display: flex; flex-direction: column;">
<div class="ant-select-tree-treenode ant-select-tree-treenode-switcher-open" draggable="false" aria-grabbed="false">
<span aria-hidden="true" class="ant-select-tree-indent"></span>
<span class="ant-select-tree-switcher ant-select-tree-switcher-noop"></span>
<span title="2022年项目——总院生产单元" class="ant-select-tree-node-content-wrapper ant-select-tree-node-content-wrapper-normal">
<span class="ant-select-tree-title">2022年项目——总院生产单元</span>
</span>
</div>
<div class="ant-select-tree-treenode ant-select-tree-treenode-disabled ant-select-tree-treenode-switcher-open" draggable="false" aria-grabbed="false">
<span aria-hidden="true" class="ant-select-tree-indent"></span>
<span class="ant-select-tree-switcher ant-select-tree-switcher_open">
<span role="img" aria-label="caret-down" class="anticon anticon-caret-down ant-select-tree-switcher-icon">
<svg viewBox="0 0 1024 1024" focusable="false" data-icon="caret-down" width="1em" height="1em" fill="currentColor" aria-hidden="true">
<path d="M840.4 300H183.6c-19.7 0-30.7 20.8-18.5 35l328.4 380.8c9.4 10.9 27.5 10.9 37 0L858.9 335c12.2-14.2 1.2-35-18.5-35z"></path>
</svg>
</span>
</span>
<span title="2022年项目——总院生产单元" class="ant-select-tree-node-content-wrapper ant-select-tree-node-content-wrapper-open">
<span class="ant-select-tree-title">2022年项目——总院生产单元</span>
</span>
</div>
<div class="ant-select-tree-treenode ant-select-tree-treenode-switcher-open ant-select-tree-treenode-leaf-last" draggable="false" aria-grabbed="false">
<span aria-hidden="true" class="ant-select-tree-indent">
<span class="ant-select-tree-indent-unit"></span>
</span>
<span class="ant-select-tree-switcher ant-select-tree-switcher-noop"></span>
<span title="2022年项目一期" class="ant-select-tree-node-content-wrapper ant-select-tree-node-content-wrapper-normal">
<span class="ant-select-tree-title">2022年项目一期</span>
</span>
</div>
<div class="ant-select-tree-treenode ant-select-tree-treenode-disabled ant-select-tree-treenode-switcher-open ant-select-tree-treenode-leaf-last" draggable="false" aria-grabbed="false">
<span aria-hidden="true" class="ant-select-tree-indent"></span>
<span class="ant-select-tree-switcher ant-select-tree-switcher_open">
<span role="img" aria-label="caret-down" class="anticon anticon-caret-down ant-select-tree-switcher-icon">
<svg viewBox="0 0 1024 1024" focusable="false" data-icon="caret-down" width="1em" height="1em" fill="currentColor" aria-hidden="true">
<path d="M840.4 300H183.6c-19.7 0-30.7 20.8-18.5 35l328.4 380.8c9.4 10.9 27.5 10.9 37 0L858.9 335c12.2-14.2 1.2-35-18.5-35z"></path>
</svg>
</span>
</span>
<span title="2022年项目——总院生产单元" class="ant-select-tree-node-content-wrapper ant-select-tree-node-content-wrapper-open">
<span class="ant-select-tree-title">2022年项目——总院生产单元</span>
</span>
</div>
<div class="ant-select-tree-treenode ant-select-tree-treenode-switcher-open ant-select-tree-treenode-leaf-last" draggable="false" aria-grabbed="false">
<span aria-hidden="true" class="ant-select-tree-indent">
<span class="ant-select-tree-indent-unit ant-select-tree-indent-unit-end"></span>
</span>
<span class="ant-select-tree-switcher ant-select-tree-switcher-noop"></span>
<span title="2022年项目二期" class="ant-select-tree-node-content-wrapper ant-select-tree-node-content-wrapper-normal">
<span class="ant-select-tree-title">2022年项目二期</span>
</span>
</div>
</div>
</div>
</div>
<div class="ant-select-tree-list-scrollbar ant-select-tree-list-scrollbar-show" style="width: 8px; top: 0px; bottom: 0px; right: 0px; position: absolute; display: none;">
<div class="ant-select-tree-list-scrollbar-thumb" style="width: 100%; height: 128px; top: 0px; left: 0px; position: absolute; background: rgba(0, 0, 0, 0.5); border-radius: 99px; cursor: pointer; user-select: none;"></div>
</div>
</div>
</div>
``` miaoxu 发表于 2022-10-18 21:10
```
大佬，分析页面元素有没有教程啊，我看了代码发现只针对我给的页面，用在实际项目就很难定位了。 ...
可以参考
React事件触发：https://bbs.tampermonkey.net.cn/thread-1250-1-1.html
那个文章
先尝试用插件确定出来数据的位置
然后再根据数组确定元素操控数据就好了
页:
[1]
2