首页 > 解决方案 > 我无法选择 puppeteer css 选择器

问题描述

我需要 puppetter page.type css 选择。

<div class="preloader">
  <div class="cssload-speeding-wheel"></div>
</div>
<section id="wrapper" class="login-register">
  <div class="login-box">
      <div class="white-box">
      <form class="form-horizontal form-material" id="loginform" method="post">
        <h3 class="box-title m-b-20">Sign In</h3>
        <div class="form-group ">
          <div class="col-xs-12">
            <input class="form-control" type="text" required="" name="login-username" placeholder="Username">
          </div>
        </div>
        <div class="form-group">
          <div class="col-xs-12">
            <input class="form-control" type="password" required="" name="login-password"  placeholder="Password">
          </div>
        </div>
         <div class="form-group">
          <div class="col-xs-12">
        <div class="form-group">
          <div class="col-md-12">

        </div>
        <div class="form-group text-center m-t-20">
          <div class="col-xs-12">
            <button type="submit" name="doLogin" class="btn btn-info btn-lg btn-block text-uppercase waves-effect waves-light" type="submit">Log In</button>
          </div>
        </div>
        <div class="form-group m-b-0">

我需要用户名、密码和 dologin。

page.type("输入[@placeholder='用户名']", 'MYUSERNAME');

此代码不起作用..请帮助我

标签: javascripthtmlcsspuppeteer

解决方案


在你的选择器中不需要@,占位符是一个伪元素。您可以为选择器使用另一个属性:

page.type("input[name='login-username']", 'MYUSERNAME');

尽管我建议您提供元素 ID,因为这将提供更好的选择器性能:

<input id="username" class="form-control" type="text" required="" name="login-username" placeholder="Username">

接着

page.type('#username', 'MYUSERNAME');

推荐阅读