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

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

相关推荐
赵谨言7 分钟前
摘要本研究旨在构建一套基于OpenCV与CNN融合技术的银行卡号自动识别系统,重点解决不同银行卡号字体格式差异、倾斜污损等复杂场景下的识别难题
大数据·开发语言·经验分享·python
青青家的小灰灰9 分钟前
深入理解 JavaScript 箭头函数:从语法糖到核心机制
前端·javascript·面试
147API10 分钟前
Claude JSON 稳定输出:Schema 校验与修复回路(Kotlin)
开发语言·kotlin·json·claude
于先生吖11 分钟前
Java 打车小程序 APP 源码 顺风车滴滴跑腿系统完整实现
java·开发语言·打车系统
cxxcode12 分钟前
Web Vitals 数据采集机制分析
前端
sniper16 分钟前
AI+Shopify 前端开发:实战一年后,聊聊 AI Agent 和前端的生死局
前端
南囝coding16 分钟前
OpenClaw 到底能干什么?可以看看这 60 个真实用例
前端·后端
重庆穿山甲20 分钟前
Java开发者的大模型入门:AgentScope Java组件全攻略(二)
前端·后端
我爱吃土豆111925 分钟前
从零到上架:Chrome 新标签页生产力扩展 FocusTab
前端·产品
zh路西法25 分钟前
【C语言简明教程】(一):数据类型,表达式与控制结构
c语言·开发语言