Question

How can I use JavaScript to read the contents of a single element on the same page as the JavaScript without re-loading the entire page (just re-loading the one element)? The single element must be read from the page from the server, not the browser’s copy of the page. This is because the server will dynamically change the element.

The page has…

HTML elements, like <p id="target_element">..<dynamically changing data>..</p>

How can my JavaScript go back and read the contents of “target_element” without reloading the entire page.
(The server will periodically change the "..<dynamically changing data>.." inside the element.

thanks.

Answer 1

If you are familiar with jQuery, there is a convenient method called load() that will do it for you.

With something like this, you would replace the content of the element with id “target_element”, with the content that comes back from URL content.php.

$('#target_element').load('content.php #target_element');

If you don’t want to use a library like jQuery, or similar, then you have some writing to do to get cross-browser support for your Ajax-request and so on. So a library is probably the easiest way to go about this.