|
|
@@ -4,6 +4,7 @@
|
|
4
|
4
|
<meta charset="UTF-8">
|
|
5
|
5
|
<link href="./css/style.css" type="text/css" rel="stylesheet">
|
|
6
|
6
|
<title>Import Local JSON Data | Zipcode Wilmington</title>
|
|
|
7
|
+ <!-- <script src = "jsonparse.js"></script> -->
|
|
7
|
8
|
</head>
|
|
8
|
9
|
<body>
|
|
9
|
10
|
<header class="main-header group">
|
|
|
@@ -36,7 +37,39 @@
|
|
36
|
37
|
|
|
37
|
38
|
<section>
|
|
38
|
39
|
<h1>Movie Information</h1>
|
|
39
|
|
- <div id="result"></div>
|
|
|
40
|
+ <div id="result">
|
|
|
41
|
+ </div>
|
|
40
|
42
|
</section>
|
|
|
43
|
+ <script>
|
|
|
44
|
+ var httpClient=function(){
|
|
|
45
|
+ var xhr = new XMLHttpRequest();
|
|
|
46
|
+ // xhr.open('GET','https://data.sfgov.org/api/views/yitu-d5am/rows.json?accessType=DOWNLOAD');
|
|
|
47
|
+
|
|
|
48
|
+ xhr.onreadystatechange = function(){
|
|
|
49
|
+ if((xhr.status===200) && (xhr.readyState===4)){
|
|
|
50
|
+ var movies = JSON.parse(xhr.responseText);
|
|
|
51
|
+ var output = "";
|
|
|
52
|
+
|
|
|
53
|
+ for(let i = 0; i < movies.data.length; i++){
|
|
|
54
|
+ if(movies.data[i][10]=='Golden Gate Bridge'){
|
|
|
55
|
+ output += "Movie Title: " + movies.data[i][8] + "<br/>"
|
|
|
56
|
+ + "Release Year: " + movies.data[i][9] + "<br/>"
|
|
|
57
|
+ + "Production Company: " + movies.data[i][12] + "<br/>"
|
|
|
58
|
+ + "<br/>";
|
|
|
59
|
+ }
|
|
|
60
|
+ }
|
|
|
61
|
+ document.getElementById('result').innerHTML = output;
|
|
|
62
|
+ }
|
|
|
63
|
+
|
|
|
64
|
+ }
|
|
|
65
|
+ var url = 'https://data.sfgov.org/api/views/yitu-d5am/rows.json?accessType=DOWNLOAD';
|
|
|
66
|
+ xhr.open("GET", url, true);
|
|
|
67
|
+ xhr.setRequestHeader("Content-Type", "text/plain");
|
|
|
68
|
+ xhr.send();
|
|
|
69
|
+ return movies;
|
|
|
70
|
+ }
|
|
|
71
|
+ httpClient();
|
|
|
72
|
+ </script>
|
|
41
|
73
|
</body>
|
|
42
|
|
-</html>
|
|
|
74
|
+
|
|
|
75
|
+</html>
|
thulasi
7 年前