1、JQuery的选择器实例
| 语法 | 描述 |
|---|
| $(this) |
当前 HTML 元素 |
| $("p") |
所有 <p> 元素 |
| $("p.intro") |
所有 class="intro" 的 <p> 元素 |
| $(".intro") |
所有 class="intro" 的元素 |
| $("#intro") |
id="intro" 的元素 |
| $("ul li:first") |
每个 <ul> 的第一个 <li> 元素 |
| $("[href$='.jpg']") |
所有带有以 ".jpg" 结尾的属性值的 href 属性 |
| $("div#intro .head") |
id="intro" 的 <div> 元素中的所有 class="head" 的元素 |
2、原生js定位元素的方法
document.getElementById("intro") # id=intro的某个元素
document.getElementsByClassName("red") # class="red"的全部元素
document.getElementsByName("login") # name=login的全部元素
document.getElementsByTagName("p") # 所有 <p> 元素
document.getElementsByTagNameNS("ns","name") # 指定命名空间和节点名称的全部元素
document.querySelector("css_selector") # 返回文档中匹配指定 CSS 选择器的一个元素
document.querySelectorAll() # 返回匹配 CSS 选择器的全部元素
3、js操作浏览器
webdriver和js的api对比
| 文本框中输入 |
webdriver |
driver.find_element_by_css_selector("[name='username']").send_keys('terry001') |
| jQuery |
$("[name='username']").eq(0).val('terry001'); |
| 原生java_script |
var el=document.querySelector("[name='username']");el.value="terry001"; |
| 文本框清空 |
webdriver |
driver.find_element_by_css_selector("[name='username']").clear() |
| jQuery |
$("[name='username']").eq(0).val(''); |
| 原生java_script |
var el=document.querySelector("[name='username']");el.value=""; |
| 读取文本框中输入的文本 |
webdriver |
无 |
| jQuery |
$("[name='username']").eq(0).val(); |
| 原生java_script |
var el=document.querySelector("[name='username']");el.value; |
| 获取文本 |
webdriver |
driver.find_element_by_css_selector("#los>h2").text |
| jQuery |
$("#los>h2").text(); |
| 原生java_script |
var el=document.querySelector("#los>h2"); el.innerText; |
| 获取元素属性 |
webdriver |
driver.find_element_by_css_selector("[name='login']").get_attribute('type') |
| jQuery |
$("[name='login']").eq(0).attr("type") |
| 原生java_script |
var el=document.querySelector("[name='login']"); el.getAttribute('type'); |
| 鼠标左键点击 |
webdriver |
driver.find_element_by_css_selector("[name='login']").click() |
| jQuery |
$("[name='login']").eq(0).trigger('click') |
| 原生java_script |
var el=document.querySelector("[name='login']"); el.click(); |
| 复选框是否被选中 |
webdriver |
driver.find_element_by_css_selector("[name='memberPass']").is_selected() |
| jQuery |
$("[name='memberPass']").is(':checked') |
| 原生java_script |
var el=document.querySelector("[name='memberPass']"); el.checked; |
| 当前页面跳转到新网址 |
webdriver |
driver.get("https://www.baidu.com/") |
| jQuery |
window.location.href='https://www.baidu.com'; |
| 原生java_script |
同jQuery |
| 在新窗口中打开网址 |
webdriver |
无 |
| jQuery |
window.open("https://www.jd.com/"); |
| 原生java_script |
同jQuery |