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")

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

相关推荐
Amos_Web8 分钟前
通过 Rspack 源码学 Rust(二):所有权、借用与 `&mut`
前端
计算机魔术师15 分钟前
AI公司把「灾难性风险」写进招股书?Anthropic这5处反常
前端
西凉的悲伤15 分钟前
Jsoup 库 HTML 解析详解
java·前端·html·jsoup
niucloud-admin18 分钟前
NIUCLOUD PHP SAAS上门家政使用文档
前端·人工智能·ai编程
qq_4017004121 分钟前
Qt Modbus 源码剖析:从 QModbusClient 到工业级通信框架
开发语言·qt·系统架构
星夜离尘5623 分钟前
MATLAB 角度解缠遇到丢样:先分段,再说明圈数为什么不可恢复
开发语言·matlab
不一样的故事12630 分钟前
Prompt 工程(Prompt Engineering)
前端·人工智能·python
我命由我1234531 分钟前
6-2.Python 异常处理 - 异常捕获(捕获指定异常、常见异常类型、异常信息)
java·运维·开发语言·python·http·https·java-ee
ZoeLandia34 分钟前
React08:自定义 Hook
开发语言·前端·react.js·typescript
2601_9499706935 分钟前
msgpackr 跨端三方库仓颉适配全流程
前端·javascript·flutter