How to Get Value of a Div Using JavaScript

How to get value of a div using javascript

DIVs do not have a value property.

Technically, according to the DTDs, they shouldn't have a value attribute either, but generally you'll want to use .getAttribute() in this case:

function overlay()
{
var cookieValue = document.getElementById('demo').getAttribute('value');
alert(cookieValue);
}

Get value from div with javascript: Always get undefined

Try this

var n1 = document.getElementById('editor').innerHTML; // or innerText, or textContent

How to get value inside a div element using JS

Give this a try

<p class="med_prescribed">Prescribed: {{ pro_id.prescribedmed }}</p>

in your JS as follows

var premed = document.getElementsByClassName('med_prescribed')[0].innerText;
console.log(premed);

Get value inside Div Javascript

You could access your element directly from gridcell0 using gridcell0.querySelector('.DivOverflowNoWrap') instead, like :

var gridcell0 = document.querySelector('#x');
console.log( gridcell0.querySelector('.DivOverflowNoWrap').innerHTML );

Snippet:

var gridcell0 = document.querySelector('#x');

if (gridcell0.querySelector('.DivOverflowNoWrap') !== null) {
console.log(gridcell0.querySelector('.DivOverflowNoWrap').innerHTML);
} else {
console.log('Does not exist');
}
<div id="x">
<div class="DivOverflowNoWrap Ellipsis" style="width:100%;" data-textwidth="50" data-originaltext="DefaultText" data-ingrid="1">DefaultText</div>
</div>

How to set value inside div in JS

var errorMsg = "<p>Example error message</p>"
document.getElementById("error").innerHTML = errorMsg

Get content of a DIV using JavaScript

(1) Your <script> tag should be placed before the closing </body> tag. Your JavaScript is trying to manipulate HTML elements that haven't been loaded into the DOM yet.

(2) Your assignment of HTML content looks jumbled.

(3) Be consistent with the case in your element ID, i.e. 'DIV2' vs 'Div2'

(4) User lower case for 'document' object (credit: ThatOtherPerson)

<body>
<div id="DIV1">
// Some content goes here.
</div>

<div id="DIV2">
</div>
<script type="text/javascript">

var MyDiv1 = document.getElementById('DIV1');
var MyDiv2 = document.getElementById('DIV2');
MyDiv2.innerHTML = MyDiv1.innerHTML;

</script>
</body>

Retrieve value property of div in the click event

A div does not have a value property. You could probably retrieve it with getAttribute but there is an easier solution. Change value={option.value} onClick={(e, value) => handleClick(e, value)} to onClick={(e) => handleClick(e, option.value)}

As a side not you should not make clickable divs for accessibility reasons. You should either use styled button or anchor tags. At the very least add the aria attribute role="button" to the div.

How can get the text of a div tag using only javascript (no jQuery)

You'll probably want to try textContent instead of innerHTML.

Given innerHTML will return DOM content as a String and not exclusively the "text" in the div. It's fine if you know that your div contains only text but not suitable if every use case. For those cases, you'll probably have to use textContent instead of innerHTML

For example, considering the following markup:

<div id="test">
Some <span class="foo">sample</span> text.
</div>

You'll get the following result:

var node = document.getElementById('test'),

htmlContent = node.innerHTML,
// htmlContent = "Some <span class="foo">sample</span> text."

textContent = node.textContent;
// textContent = "Some sample text."

See MDN for more details:

  • textContent
  • innerHTML

JavaScript: Extract value from div element

First you should give your DIV an id.

<div id="myid" data-variableid2="1234"> </div>

Then you could display the attributes data using

var MyDiv1 = document.getElementById('myid');
alert(MyDiv1.getAttribute('data-variableid2'));

Just test it here: http://jsfiddle.net/5C4NA/

But if you are not allowed to change the HTML of your pages, you should stick to something like

document.getElementsByTagName("div")[0]

but the index (here 0) does vary with the position of the div within the HTML page.

Edit 1:

With a loop you are able to scan through all DIVs and choose the one with an attribute data-variableid2: http://jsfiddle.net/5C4NA/1/ This looks like:

var elm = document.getElementsByTagName("div");
for (i=0;i<elm.length;i++) {
if (elm[i].getAttribute('data-variableid2')!=null) {
alert(elm[i].getAttribute('data-variableid2'));
}
}


Related Topics



Leave a reply



Submit