javascript根据url参数从数组中获取属性
我正在尝试根据 url 中的值过滤 json 数组并获取属性vernacularName。在 F12 调试中，我可以输入record[0].vernacularName;它，它给了我正确的变量，但下面的代码仍然失败。
document.getElementById("demo").innerHTML = datasetID;有效但document.getElementById("demo").innerHTML = vernacularName;无效。
最终我想添加 vernauralName 作为会话变量
<body>
<div class="">
<h3>testing data</h3>
<p id="demo" class = 'pl-5'></p>
</div>
<script type="text/javascript">
const queryString = window.location.search;
const urlParams = new URLSearchParams(queryString);
const species = urlParams.get('species')
const bone = urlParams.get('bone')
const datasetID = urlParams.get('datasetID')
var data;
$.getJSON("json/data.json", function(json){
data = json;
});
record = data.filter(r => r.datasetID == datasetID);
var vernacularName = record[0].vernacularName;
// const vernacularName2 = record.vernacularName;
$_SESSION["v"] = vernacularName;
</script>
<script>
document.getElementById("demo").innerHTML = vernacularName;
</script>
噜噜哒1回答
-
慕雪6442864
首先，我不确定为什么document.getElementById("demo").innerHTML = vernacularName;位于其自己的script标签内。这看起来很奇怪。无论如何，这里的问题是数据还没有准备好。在数据返回给您之前，您无法开始处理数据并使用它来更新页面上的元素。这就是第二个参数的全部要点- 它是在获取数据后getJSON成功调用的函数。因此，其余代码应该全部放在该函数内： $.getJSON("json/data.json", function(json) { const data = json; const record = data.filter(r => r.datasetID === datasetID); const vernacularName = record[0].vernacularName; $_SESSION["v"] = vernacularName; document.getElementById("demo").innerHTML = vernacularName; });旁注：var既然您似乎正在使用 ES6+，那么除非您有充分的理由，否则您不应该使用。let代替使用。
随时随地看视频慕课网APP
相关分类
JavaScript