var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
alert(this.responseText);
}
};
xhttp.open("GET", "https://zbapi.herokuapp.com/", true);
xhttp.setRequestHeader("Content-type", "application/json");
xhttp.send();
This is my code. It is returning html text but i want it to load html output.
It is returning html text but i want it to load html output.
alert expects to be passed plain text.
You need to put the HTML source code somewhere which expects HTML source code.
For example, the innerHTML of an Element object.
The URL you are requesting, however, includes relative URLs and has its own JS. It doesn't make much sense to request it with JS and then try to render it. You would also certainly be better off just triggering navigation with location = "https://zbapi.herokuapp.com/".
You need to parsing HTML page to JSON with some parser on the server and send parsed data to the client in JSON format. For example, Himalaya (in Node.js).
Official repository of Himalaya
or use html2json (NPM Repository) to parse on client
Related
I am making a javascript library(hopefully I can complete it), and so I want to know the name of the sites that are using the script. I made an XML file <?xml version="1.0" encoding="UTF-8"?> <logs> <sites></sites> </logs>, with this code. I have the following code in the javascript library:
waste.runner = function(){
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
myFunction(this);
}
};
xhttp.open("GET", "logs.xml", true);
xhttp.send();
function myFunction(xml) {
var xmlDoc = xml.responseXML;
var x;
x = xmlDoc.getElementsByTagName("logs")[0].getElementsByClassName('sites');
x.nodeValue += "site:"+window.location.href+";";
}
}
I looked through countless sites but none of them solve the problem, and I have reached this code. Is there any way I can change the data of an XML file using HTML and javascript?
Js can't do that.
The change happens within the browser, and it remains there.
You should make a request to the server and send the name of the website, and the server should save the input in some file or db.
I advice you to use the fetch API instead of XHR.
Your js will be:
fetch('example.php?website='+window.location.href)
inside fetch you will put the name of a file on your server.
I am trying to show multiple xml file into html. I able get single xml file show in html table by using xmlhttp.open("GET", "204S_2000_02_17_00_30_357.xml", true). However, I can't get multiple xml file using this function.
I had tried using xmlhttp.open("GET", "*.xml", true) but doesn't get any output.
It's any solution or method to "GET" the multiple xml file into html?
Noted: xml file will continuously generate in folder with random name.(example 204S_2000_02_XX_XX_XX_XX.xml).
code that show single xml file in html table
function loadXMLDoc() {
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
myFunction(this);
}
};
xmlhttp.open("GET", "204S_2000_02_17_00_30_357.xml", true);
xmlhttp.send();
}
function myFunction(xml) {
//coding....
}
One HTTP request gets one HTTP response.
In general, you can't get multiple files back from a single request using a wildcard.
You could, if you wrote suitable server-side code, have the server recognise a wildcard in the URL and respond by (for example) sending a zip file containing all the files that matched, or generating a new XML document containing the contents of all the files that matched.
Generally, however, you will make a separate request for each resource you want. Having determined all the URLs you wanted to request, you would probably want to use an API that supported promises (i.e. fetch instead of XMLHttpRequest) so you could feed them into Promise.all and run the next stage of the program once you had collected all the data.
I know there are several questions how to save changes in an XML file using Javascript, and the obvious answer is: use a server side language such as PHP.
In my case, the XML file is in the same directory as my html file locally on my computer, not on any server.
In my index.html I access the alphabets.xml this way:
function getAlphabets() {
var xhttp;var result;
xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
result = findAlphabets(this);
console.log(result);
}
};
xhttp.open("GET", "alphabets.xml", true);
xhttp.send();
}
I want to change some data in the xml file, and save it back there. Is there any possible way to do so in plain javascript?
Or another way, not using a server side language?
Is it posible to request a JSON object from my browsers local storage with Ajax? it's just a simple object that i made with Js, and converted into JSON.
I then stored it to local browser storage, but i'm not sure that will work, considering that it might only work to request from a server.
I have seen simular questions about this, but i only see examples of jQuery, not pure JavaScript and AJAX.
<p id="demo"></p>
<script>
var info = {
name: "Josh",
age: 22,
born: "New York"
};
var jason = JSON.stringify(info);
localStorage.setItem("myJason", jason)
var http = new XMLHttpRequest();
http.open("GET", "file:///D:/HTML%20Files/Nettside%20med%20JSON%20og%20AJAX/nettside.html", true);
http.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("demo").innerHTML = this.responseText;
}
};
http.send();
If you are running the html file from the local disk then yes you can access it by navigating the file structure using "../" to go up a file, however if the HTML file has been loaded from a web server then the only way to access it is to use a file input and then read the file contents. The user must choose the file though.
Here is an article on reading binary data from a file that the user has selected.
https://www.html5rocks.com/en/tutorials/file/dndfiles/
I have a large file format "json". I need to use this information when you open the page in a browser. the only solution - is to place the data into a variable in the ".js" file, but it turns out 5000 lines. Maybe there is an option to read data? I open the page in folder
The JSON.parse() method parses a JSON string, constructing the
JavaScript value or object described by the string.
-MDN
If you need those objects to render out your webpage / webapp you're going to have to get them to the browser. Break up the JSON. Don't forget to minify.
I think the desired architecture would be to use XHR or filesystem (if that's really your use case / local only) to grab what JSON you need on demand.
If you want to have the data directly, you have to put it in a .js file like you did. You could write a build rule to create this .js file from the .json file.
Another solution is using Ajax, which will allow from the js to fetch the content of the .json and store it into a variable.
You can use <link> element with rel attribute set to "import", get and pass link.import.body.textContent to JSON.parse() to create javascript object from JSON.
<script>
let json;
function handleJSON(link) {
json = JSON.parse(link.import.body.textContent);
}
window.onload = function() {
console.log(json)
}
</script>
<link id="json" rel="import" type="application/json" href="https://gist.githubusercontent.com/guest271314/ffac94353ab16f42160e/raw/aaee70a3e351f6c7bc00178eabb5970a02df87e9/states.json" onload="handleJSON(this)"/>
//basic method !! think about handling the exceptions...
if (window.XMLHttpRequest) { // Objet standard
xhr = new XMLHttpRequest(); // Firefox, Safari, ...
} else if (window.ActiveXObject) { // Internet Explorer
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
// Ajax req
xhr.onreadystatechange = function () {
// if ok 200
if (this.readyState == 4 && this.status == 200) {
data = this.response
// your data
console.log(data[0].title);
}
}
xhr.open("GET", "resc/placeholder.json", true)
xhr.responseType = "json"
xhr.send(/*prams if needed */)