I'm trying to dispay the one node e.g. "title" on a internal html page but I need it to pull the data from an XML document that is saved on my Desktop but it doesn't seem to be finding the XML document. I'm not to sure what to add or how to combat this problem? Any help would be much appreciated! Many thanks
var parser, xmlDoc;
var text = loadXMLDoc("/Desktop/test.xml");
parser = new DOMParser();
xmlDoc = parser.parseFromString(text,"text/xml");
document.getElementById("demo").innerHTML =
xmlDoc.getElementsByTagName("title")[0].childNodes[0].nodeValue;
First of all you can't access any files from the absolute path of your system due to security reasons. you must need to upload file at first place, there after you can process the XML content.
follow link below tried to create small snippet for you.
HTML:
<div>
<label id="txtFileInfo"></label>
<input id="xmlFile" type="file">
</div>
JS:
(function($){
$('#xmlFile').unbind('change')
.bind('change', function(e){
if(this.files.length > 0){
var file = this.files[0];
if(file.type == 'text/xml'){
setTimeout(function(){
console.log('Reader');
var reader = new FileReader();
reader.addEventListener('load', function(){
console.log(reader.result);
parser = new DOMParser();
xmlDoc = parser.parseFromString(reader.result, file.type);
console.log(xmlDoc);
});
reader.readAsDataURL(file);
}, 100);
}
// $('#txtFileInfo').text('Type: '+ file.type);
}
});
})($);
https://codepen.io/smtgohil/pen/gGWoRe
All the best.