JavaScript - 单击代码中的每个按钮

Question

我正在尝试做以下练习。我想从 Chrome 开发控制台循环浏览属于一个类的所有按钮并单击每个按钮。 在我不知道来源的页面上，这是一个类似于脚本的机器人。可能这是一个糟糕的问题……请不要踢我太多。

代码如下，但点击只在第一个元素上执行：

Clicker();

function Clicker ()
{
    var buttons = document.getElementsByClassName('myclass');
    for (var i = 0; i <= buttons.length; i++) {
        if(buttons[i])
        {
            if(buttons[i].firstChild.nodeValue)
            {
                if(!buttons[i].disabled)
                {
                    buttons[i].click();
                }   
            }
        }   
    }

    return 'execution complete';
}

按钮的写法如下：

<button class="myclass" data-action="perfom_job.perform_job">
        Perform Some Job
</button>
<button class="myclass" data-action="perfom_job.perform_job">
        Perform Some Job
</button>
<button class="myclass" data-action="perfom_job.perform_job">
        Perform Some Job
</button>
<button class="myclass" data-action="perfom_job.perform_job">
        Perform Some Job
</button>

如果我将按钮 [i] 插入到 console.log() 中，则会在元素检查器中查看右键。 可能是什么问题？

点击的按钮变成

<button class="myclass" disabled="">
   Perform Some Job
</button>

更新 1

我也尝试过这样的功能

Clicker();

function Clicker ()
{
    var buttons = document.getElementsByClassName('myclass');
    var enabled_buttons = [];

    for (var i = 0; i < buttons.length; i++) {
        if(buttons[i])
        {
            if(buttons[i].firstChild.nodeValue)
            {
                if(!buttons[i].disabled)
                {
                    enabled_buttons.push(buttons[i]);
                }   
            }
        }
    }
    console.log(enabled_buttons.length);
    if(enabled_buttons.length > 0)
    {
        enabled_buttons[0].click();
        Clicker();
    }
}

导致递归访问函数时进入无限循环，点击后看不到启用较少的元素。

更新 2

我使用 Selenium 和我的 Visual Studio Community 2017 进行了一些设置，并尝试使用 Microsoft Edge 自动化进行相同的设置，以便更清楚地获取错误！

using (IWebDriver driver = new EdgeDriver())
{
    driver.Url = txtUrl.Text;

    IReadOnlyCollection<IWebElement> query = driver.FindElements(By.ClassName("myclass"));

    foreach(IWebElement elem in query)
    {
        elem.Click();        
    }  
}

循环中的第一个元素没问题，我得到的第二个元素：

System.InvalidOperationException: 'Element is obscured'

更新 3

这种错误是由于浏览器无法正确导航到元素的问题引起的。请参阅我的回复，了解我是如何解决的

Answer 1

最后，我不得不离开 Idea 使用带有 javascript 粘贴代码的 chrome 控制台来完成这种工作。我选择了 Visual Studio Community 2017 C# + Selenium WebDriver + ChromeDriver

这是工作代码：

using System;
using System.Linq;
using System.Collections.Generic;
using OpenQA.Selenium;
using OpenQA.Selenium.Chrome;
using OpenQA.Selenium.Interactions;

namespace DefaultNameSpace
{
    class MainClass
    {
        public static void Main(string[] args)
        {
            ChromeOptions options = new ChromeOptions();
            //I have used my Chrome's default profile. The path is for MacOSX
            options.AddArguments("user-data-dir=/Users/<user name>/Library/Application Support/Google/Chrome/Default");
            options.AddArguments("disable-infobars");

            string s;
            Console.WriteLine("Enter Command:");
            while (true)
            {
                s = Console.ReadLine();
                if (s.ToLower() == "exit")
                {
                    Environment.Exit(0);
                }
                else
                {
                    using (IWebDriver driver = new ChromeDriver(options))
                    {
                        driver.Url = s;
                        Clicker(driver);
                    }
                    Console.WriteLine("Execution complete");
                }
            }

        }

        private static void Clicker(IWebDriver driver)
        {
            IReadOnlyCollection<IWebElement> query = driver.FindElements(By.CssSelector(myclass));

            foreach (IWebElement elem in query)
            {
                if (elem.Enabled && elem.Text.Trim() == "Button text")
                {
                    try
                    {
                      //go to the page top
                      IJavaScriptExecutor jse = (IJavaScriptExecutor)driver;
                      jse.ExecuteScript("window.scrollBy(0,0)", "");

                      //go to button and make click
                      Actions actions = new Actions(driver);
                      actions.MoveToElement(elem).Click().Perform();

                      Clicker(driver);
                   }
                   catch (Exception ex)
                   {
                      string log = ex.ToString();
                   }
                   finally
                   {
                        //Clicker(driver);   
                   }
               }
           }
        }
    }
}

Answer 2

function Clicker() {
    var buttons = $('button.myclass');
    $.each(buttons, function () {
        if (!$(this).is(":disabled")) {
            $(this).click();
        }
    });

    return 'execution complete';
}         

也许对你有帮助