CODEWITHSUNDEEP
javascript
Anurag Chakraborty
Anurag Chakraborty

Reputation: 521

Javascript: How to setValue to HTMLDivElement?

My HTML page code looks like this-

<div id="test-inputEl" role="textbox" class="test-field" data-errorqtip="">10</div>

To access this value 10 I am using below code-

var divObject = parent.document.getElementById('test-inputEl');
alert(divObject);
var testField = divObject.getElementsByClassName("test-field");
alert(testField);

For the first alert box I'm getting-

[object HTMLDivElement]

and for the second one I'm getting-

[object HTMLCollection]

But I can't access the value. I have tried like this-

var objValue = divObject.getElementsByClassName("x-form-display-field")[0].innerHTML;

But not Working. Is there any way to get this value or set this value using javascript. Because I'm not much familiar with jquery.

Upvotes: 1

Views: 1757

Answers (2)

Tushar
Tushar

Reputation: 87203

Use innerHTML property to get the value 10 from div.

var divObject = document.getElementById('test-inputEl').innerHTML;
document.write(divObject);
<div id="test-inputEl" role="textbox" class="test-field" data-errorqtip="">10</div>

Upvotes: 2

Matteo Rubini
Matteo Rubini

Reputation: 831

When you use getElementById you retrieve the HtmlElement you want, but when you use getElementsByClassName your result is a collection of HTML element, it's NOT an array!!

to get the first item, use myCollection.item(0)

var objValue = divObject.getElementsByClassName("x-form-display-field").item(0).innerHTML;

https://developer.mozilla.org/it/docs/Web/API/HTMLCollection

How to correctly iterate through getElementsByClassName

Upvotes: 1

Related Questions