How to select specified element with CasperJS?

Question

I want to select first <span> and second <span> , then get their innerText.

Bur i try to use xpath or document.querySelector , they are no working. I console.log my array show null.

// I want to select first <span>
function getDate() {
    var date = document.querySelector('div.movie_intro_info_r li').selectedIndex = 1;
    return Array.prototype.map.call(date, function (e) {
        return e.innerHTML;
    });
};
// I want to select second <span>
function getMovieLength() {
    var movieLength = document.querySelectorAll(x('//*[@class="movie_intro_info_r"]/span[2]'));
    return Array.prototype.map.call(movieLength, function (e) {
        return e.innerText;
    });
};

casper.then(function () {
    casper.each(movieHref, function (casper, url) {
        casper.thenOpen(url, function () {
            casper.waitForSelector('div.btn_gray_info.gabtn', function () {
                console.log('wait for element');
            });
            releaseDate[urlCount] = this.evaluate(getDate);
            console.log(releaseDate[urlCount]);// show null

            movieLength[urlCount] = this.evaluate(getMovieLength);
            console.log(movieLength[urlCount]);// show null
            urlCount++;
        });
    });
});

How can I just select specified element and get its innerText?

Answer 1

Your code is a bit too complex for what you are trying to do. You should consider using the fetchText method with CSS selectors:

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

casper.start('YOUR_URL', function () {
  this.echo(this.fetchText('.movie_intro_info_r > span:first-of-type'));
  this.echo(this.fetchText('.movie_intro_info_r > span:nth-of-type(2)'));
}).run();