<ul id="source">
<li>北京空气质量:<b>90</b></li>
<li>上海空气质量:<b>70</b></li>
<li>天津空气质量:<b>80</b></li>
<li>广州空气质量:<b>50</b></li>
<li>深圳空气质量:<b>40</b></li>
<li>福州空气质量:<b>32</b></li>
<li>成都空气质量:<b>90</b></li>
</ul>
我的目标是从 html 文件中的<ul>...</ul>
中检索信息。数据格式应该是这样的:[["北京",90],["上海",70],.....]
数组数组中的第一个元素是中文文本的子字符串,第二个元素是数字。
我对此使用 jQuery 的想法是
function getData() {
/*
coding here
*/
var sourceData = $("#source").find("li");
/*
data = [
["北京", 90],
["北京", 90]
……
]
*/
return sourceData.map(function (item) {
return [$(item).text().substring(0,2),$(item).find("b").text()];
});
它返回["", "", "", "", "", "", "", "", "", "", "", "", "", ""]
.
所以我开始检查哪里出了问题。首先我尝试了没有像这样的jQuery的
function getData() {
var rowData = document.getElementById("source").getElementsByTagName("li");
var sourceData = [].slice.apply(rowData);
sourceData.map(function (item) {
return [$(item).text().substring(0, 2), $(item).find("b").text()];
});
它奏效了。所以我开始测试
var sourceData = $("#source").find("li");
sourceData.map(item => item);
回报是[0, 1, 2, 3, 4, 5, 6]
.我想也许var sourceData = $("#source").find("li");
的回归不是Array
而是
> sourceData.__proto__
< []
我很困惑。有人可以帮忙吗?谢谢!
根据 jQuery 文档 http://api.jquery.com/map/,map 函数的回调与原生 ES 数组 map 略有不同。回调参数说明如下:
Type: Function( Integer index, Element domElement ) => Object
A function object that will be invoked for each element in the current set
因此,请按如下方式更改getData
函数:
return sourceData.map(function (index, item) {
return [$(item).text().substring(0,2),$(item).find("b").text()];
});
这个脚本似乎有效:
function getData() {
var sourceData = [];
$("#source li").each(function (){
var li_text = $(this).text();
li_text = li_text.split(":");
var sData = [li_text[0].substring(0,2),li_text[1]];
sourceData.push(sData);
});
return sourceData;
}
小提琴