How to use javascript to set attribute of selected web element using selenium Webdriver using java?

Question

I want to use javascript to set attribute for selected element on webpage.

I have found 2 ways to set attribute using javascript

1

   WebDriver driver; // Assigned elsewhere
    JavascriptExecutor js = (JavascriptExecutor) driver;
    js.executeScript("document.getElementByID('//id of element').setAttribute('attr', '10')");

2

WebElement element = driver.findElement(By.id("foo"));
    String contents = (String)((JavascriptExecutor)driver).executeScript("return arguments[0].innerHTML;", element);

But I want to apply javascript to specific webelement which i have found using selenium webdriver

as an example i have select one link using selenium webdriver

driver.findElement(By.linkText("Click ME"))

Now I want to set attribute of this webelement using javascript

but I don't know how to combine both

please help me to find solution

alecxe · Accepted Answer · 2015-05-12 21:54:17Z

32

Along the lines of:

JavascriptExecutor js = (JavascriptExecutor) driver;
WebElement element = driver.findElement(By.linkText("Click ME"));
js.executeScript("arguments[0].setAttribute('attr', '10')",element);

edited May 12, 2015 at 21:54

alecxe

476k127 gold badges1.1k silver badges1.2k bronze badges

answered Nov 12, 2013 at 16:40

nilesh

14.3k7 gold badges70 silver badges81 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Sandeep Negi · Accepted Answer · 2020-07-06 05:38:03Z

I have also faced a similar issue and I have used the javascript Executor

so in my case, I have a list of elements on which I have to change one property

here first I am finding the element, then traversing through the list, and creating a javascriptExecutor object and then executing the script on that particular element

//arguments[0] means the element
//arguments[1] means the property
//arguments[2] means the new value of the propert


List<WebElement> unselectableDiv = driver
                .findElements(By.xpath("//div[@class='x-grid3-cell-inner x-grid3-col-6']"));

        for (WebElement element : unselectableDiv) {

            // System.out.println( "**** Checking the size of div "+unselectableDiv.size());

            JavascriptExecutor js = (JavascriptExecutor) driver;

            String scriptSetAttr = "arguments[0].setAttribute(arguments[1],arguments[2])";

            js.executeScript(scriptSetAttr, element, "unselectable", "off");

            System.out.println(" *****   check value of Div property " + element.getAttribute("unselectable"));

        }

undetected Selenium · Accepted Answer · 2020-09-04 10:38:52Z

As per your code trials:

driver.findElement(By.linkText("Click ME"))

The innerHTML seems to be set as Click ME.

So, to set a new value e.g. 10 as the innerHTML you can use the executeScript() method of the JavascriptExecutor interface and you can use the following solution:

Using innerHTML:

WebDriver driver;
WebElement element = driver.findElement(By.linkText("Click ME"));
JavascriptExecutor jse = (JavascriptExecutor) driver;
jse.executeScript("arguments[0].setAttribute('innerHTML', '10')", element);

Ideally, you need to you need to induce WebDriverWait for the elementToBeClickable() and and you can use the following solution:

Using textContent:

WebElement element = new WebDriverWait(driver, 20).until(ExpectedConditions.elementToBeClickable(By.linkText("Click ME")))
((JavascriptExecutor) driver).executeScript("arguments[0].setAttribute('textContent','10')", element);

Reference

You can find a relevant detailed discussion in:

Selenium Datepicker using JavascriptExecutor

Collectives™ on Stack Overflow

How to use javascript to set attribute of selected web element using selenium Webdriver using java?

3 Answers 3

Comments

Comments

Reference

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Reference

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related