同级向下一个元素定位,一个+表示下一个元素,++表格下下个元素
input[name='name1'] +input
td:eq(0)表示第一个td元素,此定位方式限于执行js,在selenium时用此表达式识别不到元素
$(".igrid-data [_row='0']>td:eq(0)")
JS获取元素属性值(获取元素href属性值)
document.getElementById('id1').href
document.getElementsByClassName('xh')[0].href
JS获取text
document.getElementById('id2').innerText
document.getElementsByClassName('classname2')[0].innerText
JS获取value
document.getElementById('id2').value
document.getElementsByClassName('classname2')[0].value
JS通过同级向下的元素,获取属性值
document.querySelector("[title='管理员']").nextSibling.children[0].children[0].className
nextSibling表示和[title='管理员']同级向下一个的元素,如下图所示
JS获取同级向上的元素
document.querySelector("[title='管理员']").previousSibling
JS获取元素的父级节点parentNode
document.querySelector("[title='管理员']").parentNode
CSS方式通过text定位元素
$("div:contains('搜索')")
匹配prev之后的所有siblings元素,使用'~'符号
$("form~input")
模糊匹配元素
查找id='before_xxxxx'开始的元素
$("div[id^='before_']")
查找id='xxxx_after'开始的元素
$("div[id$='_after']")
查找id='xxxx_middle_xxx'的元素
$("div[id*='_middle_']")
cssSelector定位元素
document.querySelector("[field='region']")
document.querySelectorAll("[field='region']")[0]
jQuery在 DOM 树进行水平遍历
有许多有用的方法让我们在 DOM 树进行水平遍历:
- siblings()
- next()
- nextAll()
- nextUntil()
- prev()
- prevAll()
- prevUntil()
例如:$(".fixedtablewrap").prev();#查找与class=‘fixedtablewrap’同级的上一个元素