JSON文件
[ { "name":"河南" },{ "name":"河北" },{ "name":"北京" },{ "name":"南京" },{ "name":"厦门" },{ "name":"上海" },{ "name":"深圳" },{ "name":"广东" },{ "name":"陕西" },{ "name":"山西" },{ "name":"广西" },{ "name":"四川" },{ "name":"青海" },{ "name":"黑龙江" },{ "name":"吉林" },{ "name":"辽宁" },{ "name":"内蒙古" },{ "name":"西藏" },{ "name":"新疆" },{ "name":"福建" },{ "name":"台湾" },{ "name":"澳门" },{ "name":"江苏" },{ "name":"折江" },{ "name":"安徽" },{ "name":"贵州" },{ "name":"云南" },{ "name":"湖北" },{ "name":"海南" },{ "name":"甘肃" },{ "name":"广西壮族自治区" },{ "name":"内蒙古自治区" },{ "name":"新疆维吾尔自治区" },{ "name":"宁夏回族自治区" } ]
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> </head> <body> <ul id="ul"></ul> <input type="text" id="box" onchange="onbox()"> <script> let data; let xml = new XMLHttpRequest(); xml.open("GET", "./js/index.json") xml.send(); xml.onreadystatechange = function() { if (xml.readyState == 4 && xml.status == 200) { let text = xml.responseText; data = JSON.parse(text); console.log(data); } } let ul = document.getElementById('ul'); function onbox() { let nll = ''; let next = document.getElementById("box").value; for (let i = 0; i < data.length; i++) { if (data[i].name.indexOf(next) > -1) { nll += '<li>' + data[i].name + '</li>'; } } ul.innerHTML = nll; } </script> </body> </html>
