web-dev-qa-db-ja.com

casperJsで入力タグの値を設定する方法

次のように入力要素があります:

<input type="text" class="bg-white" id="couponCode" value="">

CasperJsを使用してその値を設定/入力する方法

23
user2129794
41

このタスクを実行するために使用できるいくつかの異なる方法があります。

より複雑な操作を実行する必要がない限り、 casper.sendKeys() を使用する必要があります。


casper.sendKeys()

CasperJS環境から値を設定する場合、input要素はオプションform要素内では、casper.sendKeys()を使用できます。

_casper.sendKeys('#couponCode', 'Hello, world!');
_

casper.fill()

CasperJS環境から値を設定する場合、およびinput要素isform要素内、およびincludesname属性の場合、casper.fill()を使用できます。

_casper.fill('#form', {
  couponCode: 'Hello, world!', // #form [name="couponCode"]
});
_

casper.fillSelectors()

CasperJS環境から値を設定する場合、およびinput要素isform要素内で、CSS3セレクターを使用してinput要素を参照したい場合は、casper.fillSelectors()を使用できます。

_casper.fillSelectors('#form', {
  '#couponCode': 'Hello, world!', // #form #couponCode
});
_

casper.fillLabels()

CasperJS環境から値を設定する場合、およびinput要素isform要素内、およびincludesテキスト付きの関連するlabel要素の場合、casper.fillLabels()を使用できます。

_casper.fillLabels('#form', {
  couponCode: 'Hello, world!', // #form label[text()="couponCode"] input
});
_

casper.fillXPath()

CasperJS環境から値を設定する場合、およびinput要素isform要素内で、XPathセレクターを使用してinput要素を参照したい場合は、casper.fillXPath()を使用できます。

_casper.fillXPath('#form', {
  '//*[@id="couponCode"]': 'Hello, world!', // #form #couponCode
});
_

casper.evaluate()

Page DOM環境から値を設定する場合、input要素はオプションform要素内では、casper.evaluate()を使用できます。

_casper.evaluate(function () {
  document.getElementById('couponCode').value = 'Hello, world!';
});
_

注:evaluate()と同様に、次も使用できます: evaluateOrDie()thenEvaluate() 、または thenOpenAndEvaluate() (実行中のステップに関して2つ以上の操作を一度に実行したい場合)。

0
Grant Miller