Question

我正在尝试将css选择器从一个javascript文件传递到另一个helpers.js文件，特别是在casper.js脚本中。

我的script.js文件是......

var titleSelector = {
    value: '[itemprop="title"]'
};


var processPage = function () {

    this.wait(2000, function () {

    titles = this.evaluate(helpers.getTitles);
    utils.dump(titles);

我的helpers.js文件是

var helpers = {
    getTitles: function () {
        var tt = document.querySelectorAll(titleSelector.value);
        return [].map.call(tt, function (t) {
            return t.innerText;
        });

    }
}

如果我在helpers.js文件中硬编码'[itemprop =“title”]'代替titleSelector.value，该函数可以工作，但我无法弄清楚如何从script.js传递它。

任何人都可以建议我如何实现这一目标。任何帮助赞赏。提前谢谢。

Answer 1

为getTitles添加一个参数，以便您可以传入选择器，然后bind将变量（titleSelector）作为函数的第一个参数。这是更老派的解决方案。

// in script.js
titles = this.evaluate(helpers.getTitles.bind(null, titleSelector));

// in helper.js
var helpers = {
    getTitles: function (titleSelector) {
        var tt = document.querySelectorAll(titleSelector.value);
        return [].map.call(tt, function (t) {
            return t.innerText;
        });
    }
}

另一种方法是curry getTitles函数，因此它获取一个参数并返回一个函数来完成实际的工作。在上面的例子中，Function.prototype.bind（）基本上是为我们做的。

// in script.js
titles = this.evaluate(helpers.getTitles(titleSelector));

// in helper.js
var helpers = {
    getTitles: function (titleSelector) { return function() {
        var tt = document.querySelectorAll(titleSelector.value);
        return [].map.call(tt, function (t) {
            return t.innerText;
        });
    }}
}

这是一个使用currying的略微修改的工作示例：

＆＃13;

<div itemprop="title">MY TITLE</div>
<div itemprop="title">ANOTHER TITLE</div>


<script>
  var helpers = {
    getTitles: ts => () => {
      var tt = document.querySelectorAll(ts.value);
      return [].map.call(tt, function(t) {
        return t.innerText;
      });

    }
  }
</script>

<script>
  var titleSelector = {
    value: '[itemprop="title"]'
  };

  // Mocking utils
  const utils = {
    dump: x => console.log("DUMP", x)
  }


  const container = {
    wait: (_, cb) => cb(), // Pretend to sleep
    evaluate: cb => cb(), // Evaluates the cb
    processPage: function() {
      this.wait(2000, () => {
        titles = this.evaluate(helpers.getTitles(titleSelector));
        utils.dump(titles);
      })
    }
  }

  container.processPage()
</script>

＆＃13;

如何将变量从一个javascript文件传递到另一个helpers.js文件

1 个答案: