casperjs的选择器可以在dom下工作,他既支持css也支持xpath.

下面所有的例子都基于这段html代码:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>My page</title>
</head>
<body>
<h1 class="page-title">Hello</h1>
<ul>
<li>one</li>
<li>two</li>
<li>three</li>
</ul>
<footer><p>©2012 myself</p></footer>
</body>
</html>

CSS3

默认情况下,casperjs将字符串视为css3表达式去查找dom元素

如果要查找实例页面里的<h1 class="page-title">,你可以这样做:

var casper = require('casper').create();

casper.start('http://domain.tld/page.html', function() {
if (this.exists('h1.page-title')) {
this.echo('the heading exists');
}
}); casper.run();
或者你可以使用测试框架:
casper.test.begin('The heading exists', 1, function suite(test) {
casper.start('http://domain.tld/page.html', function() {
test.assertExists('h1.page-title');
}).run(function() {
test.done();
});
});
有一些便捷的测试方法依赖于选择器:
casper.test.begin('Page content tests', 3, function suite(test) {
casper.start('http://domain.tld/page.html', function() {
test.assertExists('h1.page-title');
test.assertSelectorHasText('h1.page-title', 'Hello');
test.assertVisible('footer');
}).run(function() {
test.done();
});
});
 

XPath

你也可以选择使用xpath表达式来替代css选择器:

casper.start('http://domain.tld/page.html', function() {
this.test.assertExists({
type: 'xpath',
path: '//*[@class="plop"]'
}, 'the element exists');
});
为了更容易的去使用和读xpath,selectXPath能给你提供帮助:
var x = require('casper').selectXPath;

casper.start('http://domain.tld/page.html', function() {
this.test.assertExists(x('//*[@id="plop"]'), 'the element exists');
});

警告:1、当你使用casperjs.fill()去填充fields时,xpath存在使用限制2、PhantomJS只支持css3选择器使用uploadFile method

[译文]casperjs使用说明-选择器的更多相关文章

  1. [译文]casperjs使用说明-测试

    capserjs自带了一个测试框架,它提供了一个使你能够更容易的测试你的web应用的工具集. 注意: 1.1版本变更 这个测试框架,包括它的所有API,仅能使用在casperjs test子命令下 如 ...

  2. [译文]casperjs使用说明-使用命令行

    使用命令行 Casperjs使用内置的phantomjs命令行解析器,在cli模块里,它传递参数位置的命名选项 但是不要担心不能熟练操控CLI模块的API,一个casper实例已经包含了cli属性,允 ...

  3. [译文]casperjs的API-clientutils模块

    casper提供了少量的客户端接口用来进行远程DOM环境注入,通过clientutils模块的ClientUtils类实例中的__utils__对象来执行: casper.evaluate(funct ...

  4. [译文]casperjs 的API-casper模块

    Casper class: 可以通过这个模块的create()方法来获取这个模块的一个实例,这是最容易的: var casper = require('casper').create(); 我们也可以 ...

  5. [译文]casperjs的API-mouse模块

    mouse类 这个类是对各种鼠标操作的抽象,比如移动,点击,双击,滚动等.它要求一个已经获得DOM属性的casper对象,能用这种方式创造一个鼠标对象: var casper = require(&q ...

  6. [译文]casperjs的API-colorizer模块

    colorizer模块包含了一个Colorizer类,它能够生成一个标准化的颜色字符串: var colorizer = require('colorizer').create('Colorizer' ...

  7. CSS 笔记——选择器

    1. 选择器 (1)类型选择器(标签选择器) 基本语法 E { sRules } 使用说明 类型选择器.以文档对象(Element)类型作为选择器. 选择面较大,适合做某种标签元素外观的常规设置. 代 ...

  8. jquery选择器使用说明

    在jquery中选择器是一个非常重要的东西,几乎做什么都离不开它,下面我总结了jquery几种选择器的用法.以方便后面直接可以用到!! 层次选择器: 1.find()://找到该元素的子元素以及孙子元 ...

  9. jQuery css()选择器使用说明

    css选择器只是jquery中的一个功能罢了,下面我来给各位朋友详细介绍jQuery css()选择器使用方法与说明详解,有需要了解学习的同学可参考. CSS操作有一个重要的方法:CSS() CSS( ...

随机推荐

  1. C程序之包含头文件

    在C程序中包含文件有以下两种方法: 方法一:#include<XXX.h> 这里的XXX一般是改动较小的标准库,用符号"<"和">"将要 ...

  2. 【原创】cython and python for kenlm

    未经允许不可转载 Kenlm相关知识 Kenlm下载地址 kenlm中文版本训练语言模型 如何使用kenlm训练出来的模型C++版本 关于Kenlm模块的使用及C++源码说明 加载Kenlm模块命令 ...

  3. vscode安装设置go

    vscode安装设置go vscode安装go配置 1.下载最新的vscode: https://code.visualstudio.com/docs/?dv=win 2.下载go: https:// ...

  4. CSS实现input默认文字灰色有提示文字点击后消失鼠标移开显示

    CSS实现input美化操作默认是为灰色,并且有提示 如下图 鼠标点击后文字消失,鼠标移开后文字显示 给input入下图添加代码 style="color:#cccccc; outline: ...

  5. css实现水平伸缩菜单

    ul li a{transition:width 500ms ease;} a:hover{width:*;} 高度向上延伸用height:*;margin-top:-*px;//负值实现向上

  6. kubernetes使用ceph

    一.有一个ceph cluster,假设已经准备好了,文档网上一大堆 二.开始集成ceph和kuberntes 2.1 禁用rbd features rbd image有4个 features,lay ...

  7. HDU 2084 数塔 (水DP)

    题意:.... 析:从下往上算即可,水DP. 代码如下: #pragma comment(linker, "/STACK:1024000000,1024000000") #incl ...

  8. java 泛型详解(转)

    普通泛型 class Point<T>{       // 此处可以随便写标识符号,T是type的简称 private T var ; // var的类型由T指定,即:由外部指定 publ ...

  9. vCenter Server Heartbeat

    1.简介 vCenter Server Heartbeat为VMware vCenter Server提供关键任务高可用性,保护虚拟基础架构免受硬件.网络.配置等的影响,基于Windows的服务,可为 ...

  10. http 错误代码

    2xx  成功  200  正常:请求已完成.  201  正常:紧接 POST 命令.  202  正常:已接受用于处理,但处理尚未完成.  203  正常:部分信息 — 返回的信息只是一部分.   ...