CODEWITHSUNDEEP
javascripthtml
Doug Null
Doug Null

Reputation: 8327

how to read a single HTML element from the server page, using Javascript

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.

Upvotes: 1

Views: 303

Answers (4)

Christofer Eliasson
Christofer Eliasson

Reputation: 33865

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. 

Upvotes: 1

Sirko
Sirko

Reputation: 74086

Basically you want to do an AJAX call to your server. If this call should only change one element, you should add a script to your server, which only emits this one element. Then you may call this script from your client's browser using AJAX and replace the element in the browser's version of the page.

Upvotes: 0

kitti
kitti

Reputation: 14834

You'll probably want to use AJAX. Try using jQuery and its AJAX functions: http://api.jquery.com/category/ajax/

Upvotes: 0

jfriend00
jfriend00

Reputation: 707876

It sounds like what you need is for your web page to make an ajax call to your server that will fetch the desired data from the server and then dynamically modify the current page based on the results from that ajax call.

It would be best if your server was modified to return JSON with just the data you're interested in rather than downloading and parsing an entire web page just to get one piece out of it.

Upvotes: 1

Related Questions