如何使用 Selenium 和 Java 获取没有标识符或 css 类 的元素的标签名称

How to get the tagName of an element with no identifier or css classes using Selenium and Java

使用 selenium 如何获取 html 标签元素,html 标签没有任何唯一标识符,下面是 html 代码:

<form data-v-48e2f75a="">
   <header data-v-48e2f75a="">
      <h4 data-v-48e2f75a="">via email</h4>
   </header>
   <div data-v-48e2f75a="" class="form-wrap">
      <div data-v-cccee08c="" data-v-48e2f75a="" class="input-wrap email-input" type="email">
         <label data-v-cccee08c="">
            <div data-v-cccee08c="" class="input-inner-wrap has-icon">

               <!--The below input tag is one of the tags I need to fetch-->
               <input data-v-cccee08c="" placeholder=" " type="email"> <i data-v-cccee08c="" class="input-label-icon icon-envelope-o"></i> <span data-v-cccee08c="" class="input-label">Your E-mail</span> <!---->
            </div>
            <!----> <!----> <!---->
         </label>
      </div>
      <div data-v-cccee08c="" data-v-48e2f75a="" class="input-wrap password-input" type="password">
         <label data-v-cccee08c="">
            <div data-v-cccee08c="" class="input-inner-wrap has-icon">
               <input data-v-cccee08c="" placeholder=" " type="password"> <i data-v-cccee08c="" class="input-label-icon icon-unlock"></i> <span data-v-cccee08c="" class="input-label">Your Password</span> <!---->
            </div>
            <!----> <!----> <!---->
         </label>
      </div>
   </div>
   <p data-v-48e2f75a="" class="secondary-utilities forgot-password"><span data-v-48e2f75a="">Forgot password?</span></p>
   <footer data-v-48e2f75a="" class="form-footer">
      <div data-v-48e2f75a="" class="secondary-utilities registration">
         <p data-v-48e2f75a="">Don't have an account?</p>
         <span data-v-48e2f75a="">Sign up new account</span>
      </div>
      <button data-v-48e2f75a="" class="app-button rose-button min-width">Sign in</button>
   </footer>
</form>

我是如何尝试获取我尝试过的元素/东西的:

    public static boolean login(WebDriver browser, String email, String password){
        List<WebElement> elements = browser.findElements(By.xpath("//input[@type='email' or @type='password']"));
        System.out.println();
        for (WebElement element : elements){
            System.out.println(element.getTagName());
            System.out.println(element.toString());
        }
        return false;
    }

但是上面的方法一直返回 null,下面是我尝试过的其他一些方法:

List<WebElement> elements = browser.findElements(By.id("input[type='email']"));
List<WebElement> elements = browser.findElements(By.cssSelector("*[type='email']"));
List<WebElement> elements = browser.findElements(By.cssSelector("*[type='email']"));

标签被一些分隔线包围...

应该是这样吗?

  List<WebElement> elements = browser.findElements(By.xpath("//input[@type='email']"));

而不是:

  List<WebElement> elements = browser.findElements(By.id("input[type='email']"));

因为你的元素没有"id"属性,你无法通过By.id找到它。

试试这个:

    WebElement emailElement = driver.findElement(By.xpath("//input[@type='email']"));
    WebElement passwordElement = driver.findElement(By.xpath("//input[@type='password']"));

或者,如果您想获取元素列表,请使用:

driver.findElements(By.xpath("//input[@type='email']|//input[@type='password']"))

因为元素是React elements as well as <input> elements to extract the <tagName> of the element using , you have to induce for the visibilityOfElementLocated() and you can use either of the following :

  • 使用 type 属性 <input>:

    System.out.println(new WebDriverWait(driver, 20).until(ExpectedConditions.visibilityOfElementLocated(By.cssSelector("//[type='email'][placeholder]"))).getTagName());
    
  • 使用 您的电子邮件 <span>:

    System.out.println(new WebDriverWait(driver, 20).until(ExpectedConditions.visibilityOfElementLocated(By.xpath("//span[text()='Your E-mail']//preceding::*[@type='email' and @placeholder]"))).getTagName());