Load html file - and access element ID's

Question

I have loaded a html file and "placed" it inside a div:

document.getElementById('my_div').innerHTML='<object type="text/html" data="table.html" ></object>';

Works fine, but when I try to get an element by it's ID in the table (from table.html) I get null/undefined.

var table = document.getElementById('my_table'); /* Nope! */

I guess I am doing it at the wrong time or place somehow. Can you help me please?

Best Regards

its because your table.html has not been loaded yet. you can move the var table retrieval inside a javascript defined in table.html or use JQuery — chaitanya
– chaitanya, Commented Apr 24, 2014 at 0:41

Justin · Accepted Answer · 2014-04-24 00:44:51Z

1

I would do this with jQuery's built-in AJAX method, .load(). Like so:

$(document).ready(function(){
    $('#my_div_id').load('/filepath/table.html');
    var table = $('#my_table');
    // Other code, presumably :)
});

answered Apr 24, 2014 at 0:44

Justin

1,33911 silver badges24 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

user3147607 Over a year ago

Thank you, will try. I guess your example works only if in the document.ready-function? Otherwise it's no different from mine except the way to load the file.

Justin Over a year ago

Yes. It may be that your browser has a cached version of table.html which doesn't have the element with the ID you're trying to get. Try a hard refresh?

Collectives™ on Stack Overflow

Load html file - and access element ID's

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related