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

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

相关推荐
小灰灰搞电子4 小时前
Rust+Slint 实现动态消息提示框源码分享
开发语言·后端·rust
宿6745 小时前
vue3-包管理器
前端·vue.js
@PHARAOH5 小时前
WHAT - Remix 入门和基本实践:理解两套产物
前端·remix
传奇开心果编程6 小时前
【Rust入门知识点学与练】第21课:Trait 进阶 Advanced Traits
开发语言·学习·rust
新时代牛马6 小时前
字符设备驱动完整篇:从 cdev_add、file_operations 到chrdev_open 与排障
开发语言·python
swordbob6 小时前
ReentrantLock 与 AQS 完整学习手册
java·开发语言
mayaairi6 小时前
Vue2 生命周期完全指南:从创建到销毁的8个钩子函数
前端·javascript·vue.js
研☆香6 小时前
一个简单的气泡弹窗制作
javascript
白山编程大哥7 小时前
Java OutputStreamWriter 详解:从字符到字节的桥梁
java·开发语言·python
xy34537 小时前
axure9.0 如何打造一个计时器(简单版)
前端·ui·html·axure·原型·产品设计