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>
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
How to get value of a div using javascript
DIV
s 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);
}
Print the contents of a DIV
Slight changes over earlier version - tested on CHROME
function PrintElem(elem)
{
var mywindow = window.open('', 'PRINT', 'height=400,width=600');
mywindow.document.write('<html><head><title>' + document.title + '</title>');
mywindow.document.write('</head><body >');
mywindow.document.write('<h1>' + document.title + '</h1>');
mywindow.document.write(document.getElementById(elem).innerHTML);
mywindow.document.write('</body></html>');
mywindow.document.close(); // necessary for IE >= 10
mywindow.focus(); // necessary for IE >= 10*/
mywindow.print();
mywindow.close();
return true;
}
how get content of div via javascript
You need to wait until the HTML docuemnt is fully loaded. Try this:
<script type="text/javascript">
window.onload = function(){
var topagge = document.getElementsByClassName("topage");
console.log(topagge);
}
</script>
EDIT:
window.getElementsByClassName returns an array of elements; then, following code will get HTML content of first element:
topagge[0].innerHTML
Get content of a div before and after id (or class) with native Javascript
You need this:
var previous = document.getElementById("helloWorld").previousElementSibling;
var next = document.getElementById("helloWorld").nextElementSibling;
Also read this,
The difference between previousSibling and previousElementSibling, is that previousSibling returns the previous sibling node as an element node, a text node or a comment node, while previousElementSibling returns the previous sibling node as an element node (ignores text and comment nodes).
How to target a div using content inside the div
Just keep it simple, find all elements with target class and pick the first one:
const el = document.getElementsByClassName('test')
$('<div>new text</div>').insertAfter(el[0])
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class='test'>First Div</div>
<div class='test'>Second Div</div>
Get value from div with javascript: Always get undefined
Try this
var n1 = document.getElementById('editor').innerHTML; // or innerText, or textContent
how to get content in a div without specific child element
alert($("div.news").contents().not("figure.summary").text());
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script><div class="news"> i need this content
<figure class="summary"> i dont need this content </figure>
</div>
how to get content of div in a html from another html
You do not need to use an iframe; you can use ajax to do that. It's very straight forward.
$(function() {
$('#result').load('a.html #content',function()
$(this).html( $('#content').html() );
});
});
EDIT
As evident from comments below, scope of question has changed. The two pages are on different domains without CORS
. Therefore the above answer would not work.
In order to use ajax
, you may want to create a server-side script to act as a proxy. Then you'll call that script on your server and it will fetch the a.html
page for you.
Related Topics
Get Position/Offset of Element Relative to a Parent Container
Passing Python Data to JavaScript via Django
Get All User Defined Window Properties
How to Replace a Regex Substring Match in JavaScript
How Dangerous Is It in JavaScript, Really, to Assume Undefined Is Not Overwritten
What's a Good Tool to Screen-Scrape with JavaScript Support
Export Table from Database to CSV File
Array Like Objects in JavaScript
Microsecond Timing in JavaScript
How to Access Dom Elements in Electron
Differences Between Contenttype and Datatype in Jquery Ajax Function
How to Block Users from Closing a Window in JavaScript
Reason Behind This Self Invoking Anonymous Function Variant
Get Keys of JSON-Object in JavaScript