js通过xpath定位元素并且操作元素以下拉框select为例

js也可以使用xpath定位元素,现在实例讲解。

页面上有一个下拉框,里面内容有三个,用F12看一下

一、使用xpath定位这个下拉框select

javascript 复制代码
el=document.evaluate('//select[@name="shoppingPreference"]', document).iterateNext()

二、为下拉框选择指定内容,比如想选择Men's,也就是第1个option(因为从0开始计算)

javascript 复制代码
el.options[1].selected = true

三、触发事件函数,使用它才能在网页上看到变化

javascript 复制代码
function fireEvent(element, event) {
                if (document.createEventObject) {
                    var evt = document.createEventObject();
                    return element.fireEvent('on' + event, evt)
                } else {
                    var evt = document.createEvent("HTMLEvents");
                    evt.initEvent(event, true, true)
                    return !element.dispatchEvent(evt);
                }
            }

四、使用触发函数,改变下拉框的页面显示内容

javascript 复制代码
fireEvent(el, "change")

运行完毕后,看页面已经发生变化。

相关推荐
程序员黑豆24 分钟前
鸿蒙应用开发之模拟器安装与使用教程
前端·harmonyos
YIAN27 分钟前
大模型总 "胡说八道"?用 LangChain.js 从零实现 RAG 语义检索系统
javascript·langchain
王莎莎37 分钟前
MCP 解决的是工具接入,科研 Agent 还缺的是科学证据接口标准化
前端·人工智能
豆浆D油条43 分钟前
QT容器类QList调用erase崩溃
开发语言·qt·rpc
jinyishu_1 小时前
C++ 多态完全指南:从基础语法到底层原理
开发语言·c++·程序人生·面试
zhanghaha13141 小时前
Python语言基础:4_数据类型转换
java·前端·python
kyriewen1 小时前
别再写useMemo了——2026年这5个React性能优化已经是反模式
前端·react.js·ai编程
OpenTiny社区1 小时前
TinyRobot v0.5.0 新版本强在哪?
前端·vue.js·github
奇牙coding1 小时前
gpt-5.6-sol 接入指南:reasoning_effort 参数配置、推理链验证与常见报错排查
前端·css·gpt·ai
larance2 小时前
机器学习特征预处理之标准化/归一化
开发语言·python·机器学习