Agantacroxi Posted September 30, 2012 Share Posted September 30, 2012 Hello,I have a question: how do you define the document object to be not the current one, but an external one? Even with AJAX?What I want to do is take the content of a certain ID, located in an external file.Like var varname = document.getElementByID("idname").innerHTML but document is not the current document.Is it possible? :blink:Thanks,Agantacroxi Link to comment Share on other sites More sharing options...
Ingolme Posted September 30, 2012 Share Posted September 30, 2012 You can load data from XML files. Though getElementById() is only from HTML, you would need to access XML nodes with getElementsByTagName(), childNodes, nextSibling, previousSibling, parentNode and other tree navigation properties. If you want to get data from another HTML file, you need to open it with window.open() and then access it using the window's reference. var n = window.open("file.html");var el = n.document.getElementById("id"); Link to comment Share on other sites More sharing options...
Agantacroxi Posted September 30, 2012 Author Share Posted September 30, 2012 (edited) Thanks for your quick response.I need to load the data from an HTML file. Your script strangely doesn't work for me, it opens a tab with the file and stops.Here is how I wrote my script: function useexternal(){var n = window.open("file.html");var el = n.document.getElementById("idname").innerHTML;document.getElementById("idname2").innerHTML = el} In the document: <p id="idname2">Lorem ipsum</p><form> <input type="button" value="Click me" onclick="loadfile()" /></form> It just opens the file without changing "Lorem ipsum" into the content of the idname id in file.html... What did I do wrong?And is it possible to perform this task without opening file.html each time? Thanks! Edited September 30, 2012 by Agantacroxi Link to comment Share on other sites More sharing options...
Ingolme Posted September 30, 2012 Share Posted September 30, 2012 It's possible that you have to wait for the file to load. Another important thing is that the file has to be on the same domain, and may not work from within the Windows filesystem. var n = window.open("file.html");n.onload = function() { var data = n.document.getElementById("idname").innerHTML; document.getElementById("idname2").innerHTML = data;} It is required to open the HTML document in a window if you want to access its DOM tree. Link to comment Share on other sites More sharing options...
Agantacroxi Posted October 1, 2012 Author Share Posted October 1, 2012 (edited) Hm, it strangely doesn't work...Insert this text in the Try it Editor: <!DOCTYPE html><html><head><script>function getIDext(){window.open("default.asp");n.onload = function() { var data = n.document.getElementById("translate_link").innerHTML; document.getElementById("idname2").innerHTML = data;}}</script></head><body> <h1 id="idname2">Try</h1><form><input type="button" value="click" onclick="getIDext()" /></form></body></html> Edited October 1, 2012 by Agantacroxi Link to comment Share on other sites More sharing options...
Don E Posted October 1, 2012 Share Posted October 1, 2012 Looks you forgot to assign n to: window.open("default.asp");var n = window.open("default.asp"); Link to comment Share on other sites More sharing options...
Agantacroxi Posted October 2, 2012 Author Share Posted October 2, 2012 Whoops you're right works now thanks Link to comment Share on other sites More sharing options...
Agantacroxi Posted October 2, 2012 Author Share Posted October 2, 2012 (edited) And why not... var url = "the url of the page containing the source you want";var http_request = false;if (window.XMLHttpRequest) { // Mozilla, Safari, and othershttp_request = new XMLHttpRequest();if (http_request.overrideMimeType) {http_request.overrideMimeType('text/xml'); //Mozilla browsers}} else if (window.ActiveXObject) { // IEtry {http_request = new ActiveXObject("Msxml2.XMLHTTP");} catch (e) {try {http_request = new ActiveXObject("Microsoft.XMLHTTP");} catch (e) {}}}else {// Code to execute if the browser doesn't support XMLHttpRequest}if (!http_request) {// Code to execute if http_request is false (meaning it hasn't transformed in XMLHttpRequest nor in ActiveXObject)return false;}http_request.onreadystatechange = function() { functiontoexecute(http_request); };http_request.open('GET', url , true);http_request.responseType = "document" //necessary when it is not an XML document but a HTML one.http_request.send(null);function functiontoexecute(http_request) {if (http_request.readyState == 4) {if (http_request.status == 200) { //Example function if everything goes wellvar htmldoc = http_request.responseXML;var alertcontent = htmldoc.getElementById('idname').innerHTML;alert(alertcontent);} else {// Code if there has been an error (404 or other)}}} The only real problem is that this is not very compatible. Chrome 18+, IE 10+, Firefox 11+, no Opera, no Safari, Firefox Mobile 11+, no other mobile browsers... Source: https://developer.mo..._XMLHttpRequest Edited October 2, 2012 by Agantacroxi Link to comment Share on other sites More sharing options...
Ingolme Posted October 2, 2012 Share Posted October 2, 2012 https://developer.mozilla.org/en-US/docs/HTML_in_XMLHttpRequestOnly supported in Chrome, Firefox and versions 10 or above of Internet Explorer. The responseXML property, otherwise, requires a perfectly formatted XML document. Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now