[译文]通过ID, TagName, ClassName, Name, CSS selector 得到element
致谢原文: <http://xahlee.info/js/js_get_elements.html>
- 通过ID得到element:
Document.getElementById(id string) 返回element object, 如果失败,得到null
注意id在页面内应该是唯一的,但在iframe的看作是另一个html页面
- 通过TagName得到element
document.getElementsByTagName(tagname)返回element object集合. tagname 如div, span, p,
var myList = document.getElementsByTagName("p"); // 得到所有p元素
myList.length; // 返回p元素总数
myList[0].style.color = "red"; // 修改第一个元素的style
- 通过ClassName得到element
document.getElementsByClassName("class values") 返回element object集合.
var myList = document.getElementsByClassName("abc");
myList[0].style.color = "red"; // make the first
one red
The class values可以是多个,用空格隔开. 比如"aa
bb",
一个元素也可以有多个ClassName, 比如:
<pclass="aa">1</p>
<pclass="bb">2</p>
<pclass="bb
aa">3</p>
<pclass="bb cc
aa">4</p>
<script>document.getElementsByClassName("aa
bb");</script>
将会得到第三和第四个元素
- 通过Name得到element
document.getElementsByName("name value") 返回element object集合.
比如:
<pname="abc">you</p>
<divclass="zz"name="xyz">me</div>
<divclass="zz"name="xyz">her</div>
<form>
<inputname="xyz"type="text"size="20">
</form>
var xyz =
document.getElementsByName("xyz");
xyz[0].style.color="red"; // make the first
one red
- 通过CSS Selector得到element
document.querySelectorAll(css selector) 返回element object集合, css selector 是string, 可以是多个用逗号隔开.
var xx = document.querySelectorAll("span.a, span.c");
for (var i = 0; i < xx.length;
i++) {
xx[i].style.color="red";
}
[译文]通过ID, TagName, ClassName, Name, CSS selector 得到element的更多相关文章
- Web自动化测试:xpath & CSS Selector定位
Xpath 和 CSS Selector简介 CSS Selector CSS Selector和Xpath都可以用来表示XML文档中的位置.CSS (Cascading Style Sheets)是 ...
- Selenium - Css Selector 使用方法
什么是Css Selector? Css Selector定位实际就是HTML的Css选择器的标签定位 工具 Css Selector可以下载火狐浏览器插件,FireFinder 或 FireBug和 ...
- 获取节点 document.getElementBy{Id,Name,TagName,ClassName
document.getElementById(" "); document.getElementByName(" "); document.getElemen ...
- 转:Selenium之CSS Selector定位详解
CSS selector定位 CSS(Cascading Style Sheets)是一种语言,它被用来描述 HTML 和 XML 文档的样式. 百度输入框: <input name=&quo ...
- selenium中Xpath和CSS Selector的使用方法
一.selenium中Xpath的使用方法 1. 什么是xpath? Xpath是XML的路径语言,通俗一点讲就是通过元素的路径来查找这个标签元素 2. 练习Xpath的工具 火狐浏览器,下载插件Fi ...
- Selenium - CSS Selector
Selenium - CSS Selector http://www.cnblogs.com/bugua/archive/2012/08/16/2641647.html 昨天我练习了用CSS(即层 ...
- css selector
文章一: http://www.jb51.net/css/68287.html 去年我学jQuery的时候,曾经做过一点选择器(selector)的笔记,今天是CSS的选择器,以后还有一部分xPath ...
- Jsoup代码解读之五-实现一个CSS Selector
Jsoup代码解读之七-实现一个CSS Selector 当当当!终于来到了Jsoup的特色:CSS Selector部分.selector也是我写的爬虫框架webmagic开发的一个重点.附上一张s ...
- Selenium 使用css selector (资源来源于网络)
Selenium - CSS Selector 昨天我练习了用CSS(即层叠样式表Cascading Stylesheet) Selector来定位(locate)页面上的元素(Elements).S ...
随机推荐
- spring整合hibernate的时候报异常org.hibernate.HibernateException: createQuery is not valid without active transaction
在整合Spring4+hibernate4时候,当代码执行到dao中CRUD操作时,报了一个异常, org.hibernate.HibernateException: createQuery is n ...
- 跟我学PHP-第一篇:如何安装Zend Studio 以及汉化和基本准备工作
昨天从早上一直弄到晚上10点,可累死我了,网上的资料都是掺次不齐,所以我写一篇系统点的文章来告诉大家怎么做. 1.如果你想进行一套PHP系统的开发,肯定是要有“尚方宝剑”的,这个尚方宝剑就是PHP工具 ...
- H5基于iScroll实现下拉刷新,上拉加载更多
前言 前一段有个手机端的项目需要用到下拉刷新和上拉加载更多的效果,脑海里第一反映就是微博那种效果,刚开始的理解有些偏差,以为下拉也是追加数据,上拉也是追加数据,后请教同事后发现其实下拉只是刷新最新数据 ...
- CSS实现单行与多行文字省略(truncation)
在上一篇文章小div布局之卡片堆叠(card-stacking)中有多行文字溢出省略的效果,这篇文章就对这种效果(包括单行文字溢出省略)的实现做个简单的记录,以防自己忘记.具体来说,就是要实现这种文字 ...
- Android测试提升效率批处理脚本
前言: APP测试过程中,经常需要用的一些命令,如adb,每次敲命令,虽可以加深印象,但个人认为那即繁琐又浪费时间.本文贴出一些我使用的批处理,以及一点点小小技巧. 目录 1.[查看APK文件信息.b ...
- iOS页面间传值的一些方式总结
废话不多说,直接进入主题: 这里要说的方式有6种:1.属性传值 2.block 3.delegate 4.UserDefault 5.单例 6.通知(篇幅原因我只写核心代码,如果看不懂可以直接在最下面 ...
- sealed、new、virtual、abstract与override 趣解
1. sealed——“断子绝孙” 密封类不能被继承.密封方法可以重写基类中的方法,但其本身不能在任何派生类中进一步重写.当应用于 方法或属性时,sealed修饰符必须始终与override一起使用. ...
- List集合去重的一种方法
前一段时间们需要对一个List<Model>集合去重,情况是该集合中会出现多个Name属性值相同的,但是其他属性值不同的数据. 在这种情况下,需求要只保留其中一个就好. 我觉得遍历和Has ...
- C#模拟Http请求时出现 基础连接已经关闭 未能为 SSLTLS 安全通道建立信任关系
//解决方法: //引入命名空间: using System.Security.Cryptography.X509Certificates; using System.Net.Security; // ...
- 扩展lamda表达中distinct按照字段去除重复
首先,我们定义一个Student类来测试. public class Student { public int ID { get; set; } public string Name { get; s ...