如何通过document对象来获取select标签下option元素的element对象?

需求:自动生成目标元素的Xpath字符串
目前思路:对document对象添加事件监听,当对页面元素进行操作时,获取activeElement,然后生成Xpath
问题:目前input的text,Button,radio和checkbox测试都没问题,但是当操作select标签下的option时,activeElement返回的还是select的element对象
有什么办法能获取到option的element对象吗

0

3个回答

    var act = document.activeElement;
    if (act.tagName=="SELECT" && act.selectedIndex>=0) {
        act = act.options[act.selectedIndex];
    }
    alert(act.tagName);

1

可通过遍历表单的 elements[] 数组来访问某个 Select 对象

0

用jquer啊,$(document).find("select option").each(function(i, optElem){

//optElem为opt对象

});
如果非得用纯js那么可以使用getElementsByTagName方法,返回一个元素数组,如document.getElementsByTagName("select"),再调用返回元素的
selecElement。getElementsByTagName(“option”)获取option元素

document的常用方法:
getElementById 获取对 ID 标签属性为指定值的第一个对象的引用。
getElementsByName 根据 NAME 标签属性的值获取对象的集合。
getElementsByTagName 获取基于指定元素名称的对象集合。

0
zhaomin_g
_赵明 回复zhaomin_g: 对于不同类型的元素不要总是使用activeElement获取,可以动过点击事件的currentTarget等等对象,你再研究下,js写的不多
大约一年之前 回复
zhaomin_g
_赵明 回复qqqq72858: 不知道你具体代码怎么写的,是否可以对option绑定事件,通过activeElement和event的targetElement配合使用,选择合适的目标元素,或者对select绑定事件的时候,获取select下选中的option来作为目标元素,用jquer都是比较好写的
大约一年之前 回复
qqqq72858
qqqq72858 您理解错了,这里的自动生成目标元素的Xpath,是指用户在页面进行操作的时候自动去获取他操作了那个元素来分析,也就是说我在进行处理的时候,并不知道用户操作的是select和option,在捕捉到触发事件的元素之后,取获取元素的tagName才能知道是操作哪个元素,所以这里操作select和option捕捉到的都是select的element对象,无法分析
大约一年之前 回复
Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
其他相关推荐
学习笔记之Document Object Model(1)——如何使用document获得文档元素(element对象)
每天学习一点点,进步多一点儿!!
select元素获取option的相关操作(7/31)
js:设置选定索引的option被选中,可应用于重置选择框 首先获取DOM对象(也就是select元素) var select = document.getElementById("xxx"); select[selectedIndex].selected = true jquery: var selected = $("#selectName option:selected") va...
获取select标签的被选中的option的id值,其它属性值也类似了
var exam_class = $("#exam_class") var option_id = $(exam_class.get(0)).find("option[selected='true']").attr("id"); // 获取select标签的被选中的option的id值,其它属性值也类似了!希望对学习web前端的同志// 们有所帮助,jquery真是太令人惊讶。 // exa...
document 获得元素节点,属性节点,文本节点
document对象是documentHTML的一个实例,也是window对象的一个属性,因此可以将document对象作为一个全局对象来访问。   Document节点的子节点可以是DocumentType,Element,ProcessingInstruction或Comment。ProcessingInstruction 对象可表示处理指令。这个不常用的接口表示 XML 文档中的一个处
document获取DOM节点的三种方法详解
最近转行做前端,刷js的时候看到document获取DOM元素的三种方法时懵逼了很久,自行研究一番后分享给大家。
dom(一)——获取文本内容的方法
在利用DOM获取节点之后 有多种方法可以获取节点中的文本内容   1. innerHTML innerHTML可以作为获取文本的方法也可以作为修改文本内容的方法 element.innerHTML 会直接返回element节点下所有的HTML化的文本内容         文本         文本          document.body.innerH
document对象的各种getElement方法
在pyppeteer里面的用法 js1 = '''() => { document.getElementsByClassName('item2 J-price-confirm')[0].click() }''' await page.evaluate(js1) 例子: <!DOCTYPE html> <html> <head> <...
Select 的绑定值为对象类型时用法 同时获取option选项的label和value值
如果 Select 的绑定值为对象类型,请务必指定 value-key 作为它的唯一性标识。 export default { data() { return { comp: { compName: '', compOrgNo: '' }, compList: [ {compName: '上海分公司',compOrgNo:
【Jave】Java解析html页面的元素Element——获取下拉框中的值和文本selected-option
一、问题说明我通过模拟登录,获取到页面的Document类对象,然后要拿出里面需要的数据;二、代码说明比如,我有一个html中的下拉框代码,我要获取选中的项(option),怎么取? 下面是一个select元素(Element),如何通过Java获取里面的值,尤其是选中值和文本? 源代码: Element HYS = doc.getElementById("cellId22select");/
Dom获取元素对象的五种方法
<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>文档对象模型</title>     <!--//通过dom获取元素对象的方法(五种)--></head&
ExtJs 获取Dom对象
ExtJs中会有三类基本对象,htmlelement , Ext.Element 和 CompositeElement 。 分别解释一下: htmlelement 指html页面的各种标记元素,可以用 document.getElementById() 获得,具有html对象的方法和属性。 Ext.Element 是最重要的EXT对象,在dom对象的基础上,又...
通过document方法来获取标签对象
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>通过document方法来获取标签对象</title> <script> /** * 通过document方法来获取标签对象 * 1)getElementBy...
Angular.element和$document的使用方法分析,代替jquery
AngularJs是不直接操作DOM的,但是在平时的开发当中,我们有的时候还是需要操作一些DOM的,如果使用原生的JS的话操作过于麻烦,所以大家一般都是使用jQuery,jQuery虽然好用,但是AngularJs是不建议和JQuery同时使用的,所以AngularJs给我们也提供了一些操作DOM的方法———Jqlite 下面以addClass()方法为例给大家讲解一下Jqlite的使用: 查...
使用document对象获取html dom对象有多少种方法,都是哪些?它们有哪些异同?
document.getElementById('id'):返回结果是一个对象,如果存在两个标签拥有相同id,则返回第一个标签对象 document.getElementsByTagName('标签名'):返回结果是一个对象集合,以数组形式放在一起 document.getElementsByName('标签name属性的值'):返回结果是一个对象集合,以数组形式放在一起 document.ge...
获取select标签下option的自定属性值
[b]获取select标签下option的自定属性值[/b] str1 str2 文章转自 http://blog.csdn.net/zho...
JavaScript 技术篇-js获取document的几种方式,js获取dom元素的常用方法。
第一类:通过属性获取。 document.getElementById("fash") 第二类:通过css选择器获取。 document.querySelector(".fash")
DOM(通过class的值获取元素&通过元素获取元素&Element类型提供简写的用于获取标准属性的方式&元素的内容1.2)
node.getElementsByTagNmae; node可以为任何节点对象 1、通过class的值获取元素 语法: node.getElementsByClassName("class属性值"); node表示任何节点对象 注意,得到的是一个集合 2、通过选择器选取元素 语法: node.querySelector("选择器名"); 获取到第一个与选择器名匹配的元素 node.query...
JavaScript之document对象获取元素
document对象 概述:浏览器对外提供的支持js操作HTML文档的一种对象,这个对象封装了HTML文档中的所有对象。当HTML文档一执行,就会创键document对象,把HTML文档中的所有信息封装到document对象中,我们要获取HTML文档中的信息,只需要操作document这个对象即可。 获取元素属性,两种方式 直接获取 <!DOCTYPE html> <html&g...
在vue中获取dom元素
原文链接地址: 在vue中经常会通过js操作dom对象,可以通过给标签添加ref属性实现, 下面通过操作dom对象实现一个点击按钮改变屏幕背景的demo,效果如下 下面是代码: Click me change backgroundColor export default{ methods: { changeBackgro
Revit API—元素操作(Element)
对特定元素的编辑操作,基本都是通过ElementId来锁定元素的。 1、元素移动 ElementTransformUtils.MoveElement 此处无法实现,原因未知 ElementFilter categoryfilter = new ElementCategoryFilter(BuiltInCategory.OST_GenericModel); ...
Js根据xpath获取元素
function _x(STR_XPATH) { var xresult = document.evaluate(STR_XPATH, document, null, XPathResult.ANY_TYPE, null); var xnodes = []; var xres; while (xres = xresult.iterateNext()) {
JS判断一个对象是否为document.Element
以前不会用instanceof,今天在调用一个函数时传了一堆不想要的参数进去,程序还能跑... 当然报了1w+错误之后浏览器基本是卡死的状态了 回头看了两眼高程,重新复习了这个方法: 首先我们需要有一个Element对象: var oBox1 = document.querySelector(".box"), aBox = document.querySelec
Revit api 获取文档内所有对象根列表
Document thisDoc =tempData.Application.ActiveUIDocument.Document;             Settings thisDocSetting = thisDoc.Settings;             Categories thisCataGroup = thisDocSetting.Categories;          
关于elementui 中select选中值绑定为对象时,如何处理
<el-select v-model="provId" placeholder="请选择省" size="small" value-key="id"> <el-option value="" label="全部"></el-option> <el-option v-for=
dom4j 遍历所有元素和属性
Dom4j是java中常用读取xml文件的工具,就方便性和性能方面,一定程度要优于JDK中Domcument和SAX解析的。package Test; import org.dom4j.Attribute; import org.dom4j.Document; import org.dom4j.DocumentException; import org.dom4j.Element; impo
document获取父页面的对象
今天在做一个简单的例子的时候遇到了一个问题 首先这个例子就是点击图片,执行函数,submit表单之后,转到另一个jsp页面 我用的是js写的,但是点击玩按钮之后能出现111的弹窗,却没有出现转换到那个页面 index.jsp <% /*String path = request.getContextPath()ISO-8859-1; String basePath = reque
Angular2+ 获取、操作DOM元素
前言 &amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;angular中在’@angular/core’库中通过提供Renderer2和ElementRef中实现了有关于DOM的操作,但是,angular中不推荐直接操作dom元素,通过变量结合内置指令是当前操作DOM的最好实践 获取DOM元素 &amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;1、通过模板变量名获取单个DOM元素 &amp;nbsp;&amp;nbs...
document对象+获取节点三种方法演示:
document对象的演示。 该对象将标记型文档进行封装。 该对象的作用,是可以对标记型文档进行操作。 最常见的操作就是,想要实现动态效果,需要对节点操作,那么要先获取到这个节点。 要想获取节点,必须要先获取到节点所属的文档对象document。 所以document对象最常见的操作就是获取页面中的节点。 获取节点的方法体现: 1,getElementById:通过标签的id属性值获取
JavaScript进阶(三)document对象及HTML元素操作
前言       本章将学习document对象以及其操作html元素的相关知识,本章知识尤为重要! 方法 1.概念 严格的意义上来将,document对象是window对象的一个属性,浏览器对外提供的支持js的用来操作HTML文档的一个对象,此对象封存的HTML文档的所有信息。 2.document获取html元素对象 看过CSS入门的同学应该都还记得,CSS有专门的选择器来标识ht...
javascript获取Document类型和Element类型属性
DOM 节点层次: Document类型 JavaScript 通过 Document 类型表示文档。在浏览器中, document 对象是 HTMLDocument(继承自 Document 类型)的一个实例,表示整个 HTML 页面。而且, document 对象是 window 对象的一个属性,因此可以将其作为全局对象来访问。 1、文档子节点 可以使用documen
node(节点)和element(元素)的区别
1.引入本文处理的xml文档 &amp;lt;bookstore&amp;gt;           &amp;lt;book category=&quot;children&quot;&amp;gt;                      &amp;lt;title lang=&quot;en&quot;&amp;gt;Harry Potter&amp;lt;/title&amp;gt;                      &amp;lt;author&amp;gt;J K. Rowling&
为何总是无法获取到DOM对象
在用 js 操作我的前端页面时,我常常不能对要操作的对象进行正确的获取,比如以下jQuery代码段获取  li  对象 //获取第一个 li 对象 $(document).ready(function(){ $("button").click(function(){ $("li:first").innerHTML = 'hhe'; })
DOM文档对象模型通过id来访问HTML元素
Document Object Model文档对象模型 DOM模型中的节点--文档可以说是由节点构成的集合。在DOM模型中有以下3种节点: 元素节点:、 文本节点:被包含在原始节点内部 属性节点:修饰元素节点海通科技 元素节点 属性节点 文本节点DOM主要提供了两种方式来访问HTML元素 1、根据id访问,通过document对象调用getElementById()方法来查找具有
DOM对象属性的设置与获取
有两种方式可以修改DOM对象的属性: [b]&quot;.&quot;运算符 和 getAttribute(setAttribute)方法。[/b] 区别如下: [code=&quot;html&quot;] [/code] [code=&quot;js&quot;] var e = document.getElementById('test'); //获取属性 //用 . 来引用,必须是内置的(IE 可以访问自定义属性),而且引用...
Js获取元素的xpath
//获取xpath function readXPath(element) { if (element.id !== "") {//判断id属性,如果这个元素有id,则显 示//*[@id="xPath"] 形式内容 return '//*[@id=\"' + element.id + '\"]'; } //这里需要需要主要字符串转译问题,可参考js 动态生
js的 select对象 和Option对象 小结
Select 对象 Select 对象代表 HTML 表单中的一个下拉列表。 在 HTML 表单中, 标签每出现一次,一个 Select 对象就会被创建。 您可通过遍历表单的 elements[] 数组来访问某个 Select 对象,或者使用 document.getElementById()。 Option 对象 Option 对象代表 HT
获取自定义属性/event的触发事件对象和绑定事件对象
1.获取自定义属性 var testEle = document.getElementById("test")   testEle.setAttribute("key","value"); // 设置   testEle.attributes["key"].nodeValue; // 获得   2.event的触发事件对象和绑定事件对象 event.target返回触发事
Java中发送url请求,获取html内容,dom对象等
一、根据url请求返回状态码 [code=&quot;java&quot;]private static int getResultHttpUrl(String url){ int responseCode=0;//状态码 try { URL u = new URL(url); try { Http...
遍历表单的 elements 集合来访问 Input 对象。(DOM elements 集合)
Firstname: Lastname: elements 集合 点击测试 $("#elementsBtn").on('click', function(event) { // 一: // <!-- elements 集合可返回包含表单中所有元素的数组。 // 元素在数组中出现的顺序和它们在
dom4j的document遍历方法
Document document=DocumentHelper.parseText(xmlStr);//根据xml字符串创建xmlElement element=document.getRootElement();//获取xml跟目录Iterator it=element.elementIterator();//获取xml迭代Element ele=null;while(it.hasNext()
相关热词 c#异步发送kafka c#窗体编号 c# 操作二进制文件 c# 反射 机制 c#线程 窗体失去响应 c#角度转弧度 c# 解析gps数据 c# vs设置 语法版本 c# json含回车 c#多线程demo