仅在2周前开始使用javascript,所以我的理解有限。
我有一些javascript代码从excel文档生成一个html表,我需要从一列的一部分中提取值并将这些值放入一个数组中。我稍后将使用它来生成折线图。代码主要需要在IE11上运行。
下面截断的示例表。
<tbody>
// several other rows here
<tr>
<td id="sjs-A16">column head A</td>
<td id="sjs-B16">column head B</td>
<td id="sjs-C16">column head C</td>
<td id="sjs-D16">column head D</td>
<td id="sjs-E16">column head E</td>
<td id="sjs-F16">column head F</td>
<td id="sjs-G16">column head G</td>
<td id="sjs-H16">column head H</td>
</tr>
<tr>
<td id="sjs-A17">1A</td>
<td id="sjs-B17">1B</td>
<td id="sjs-C17">1C</td>
<td id="sjs-D17">1D</td>
<td id="sjs-E17">1E</td>
<td id="sjs-F17">1F</td>
<td id="sjs-G17">1G</td>
<td id="sjs-H17">1H</td>
</tr>
<tr>
<td id="sjs-A18">2A</td>
<td id="sjs-B18">2B</td>
<td id="sjs-C18">2C</td>
<td id="sjs-D18">2D</td>
<td id="sjs-E18">2E</td>
<td id="sjs-F18">2F</td>
<td id="sjs-G18">2G</td>
<td id="sjs-H18">2H</td>
</tr>
<tr>
<td id="sjs-A19">3A</td>
<td id="sjs-B19">3B</td>
<td id="sjs-C19">3C</td>
<td id="sjs-D19">3D</td>
<td id="sjs-E19">3E</td>
<td id="sjs-F19">3F</td>
<td id="sjs-G19">3G</td>
<td id="sjs-H19">3H</td>
</tr>
<tr><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
<tr><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
//several more empty rows here
</tbody>
我需要E(xx)中具有ID的所有单元格的值,但只需要id sjs-E17和更大(sjs-Exx,其中xx> = 17),因此值1E-3E +但没有高于该值的单元格(所以不是sjs-E16到sjs-E1)。
我改变的行数但所需的值总是从第17行开始。如图所示,在值停止后,脚会生成几个空行,但它们都没有任何id。
预期结果只是一个包含来自单元格E17 +
的值的数组(或函数) var test_array = ["1E", "2E", "3E", ...];
答案 0 :(得分:1)
使用jQuery
,您可以执行此操作:
var td = $('[id^="sjs-E"]'),
valArray = [];
td.each(function() {
var id = $(this).attr('id'),
idVal = +id.substring(5); //parse value after `E` to number using (+)
//check if idVal is number
if (!isNaN(idVal)) {
if (idVal >= 17) {
valArray.push($(this).html());
}
}
});
console.log(valArray);
.header {
background-color: grey;
font-size: 15px;
}
td {
text-align: center;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<tbody>
<tr class="header">
<td id="sjs-A16">column head A</td>
<td id="sjs-B16">column head B</td>
<td id="sjs-C16">column head C</td>
<td id="sjs-D16">column head D</td>
<td id="sjs-E16">column head E</td>
<td id="sjs-F16">column head F</td>
<td id="sjs-G16">column head G</td>
<td id="sjs-H16">column head H</td>
</tr>
<tr>
<td id="sjs-A17">1A</td>
<td id="sjs-B17">1B</td>
<td id="sjs-C17">1C</td>
<td id="sjs-D17">1D</td>
<td id="sjs-E17">1E</td>
<td id="sjs-F17">1F</td>
<td id="sjs-G17">1G</td>
<td id="sjs-H17">1H</td>
</tr>
<tr>
<td id="sjs-A18">2A</td>
<td id="sjs-B18">2B</td>
<td id="sjs-C18">2C</td>
<td id="sjs-D18">2D</td>
<td id="sjs-E18">2E</td>
<td id="sjs-F18">2F</td>
<td id="sjs-G18">2G</td>
<td id="sjs-H18">2H</td>
</tr>
<tr>
<td id="sjs-A19">3A</td>
<td id="sjs-B19">3B</td>
<td id="sjs-C19">3C</td>
<td id="sjs-D19">3D</td>
<td id="sjs-E19">3E</td>
<td id="sjs-F19">3F</td>
<td id="sjs-G19">3G</td>
<td id="sjs-H19">3H</td>
</tr>
<!-- several empty rows -->
</tbody>
</table>
或者,使用vanilla javascript:
var tdRE = /^sjs-E([2-9]\d|1[7-9]|[1-9]{3,})$/,
els = document.getElementsByTagName('*'),
valArray = [];
for (var i = 0; i < els.length; i++) {
var match = tdRE.exec(els[i].id);
if (match) {
if ((+match[1]) >= 17) { //the (+) operator again, convert string to number and check if >= 17
valArray.push(els[i].innerHTML);
}
}
}
console.log(valArray);
.header {
background-color: grey;
font-size: 15px;
}
td {
text-align: center;
}
<table>
<tbody>
<tr class="header">
<td id="sjs-A16">column head A</td>
<td id="sjs-B16">column head B</td>
<td id="sjs-C16">column head C</td>
<td id="sjs-D16">column head D</td>
<td id="sjs-E16">column head E</td>
<td id="sjs-F16">column head F</td>
<td id="sjs-G16">column head G</td>
<td id="sjs-H16">column head H</td>
</tr>
<tr>
<td id="sjs-A17">1A</td>
<td id="sjs-B17">1B</td>
<td id="sjs-C17">1C</td>
<td id="sjs-D17">1D</td>
<td id="sjs-E17">1E</td>
<td id="sjs-F17">1F</td>
<td id="sjs-G17">1G</td>
<td id="sjs-H17">1H</td>
</tr>
<tr>
<td id="sjs-A18">2A</td>
<td id="sjs-B18">2B</td>
<td id="sjs-C18">2C</td>
<td id="sjs-D18">2D</td>
<td id="sjs-E18">2E</td>
<td id="sjs-F18">2F</td>
<td id="sjs-G18">2G</td>
<td id="sjs-H18">2H</td>
</tr>
<tr>
<td id="sjs-A19">3A</td>
<td id="sjs-B19">3B</td>
<td id="sjs-C19">3C</td>
<td id="sjs-D19">3D</td>
<td id="sjs-E19">3E</td>
<td id="sjs-F19">3F</td>
<td id="sjs-G19">3G</td>
<td id="sjs-H19">3H</td>
</tr>
<!-- several empty rows -->
</tbody>
</table>
正则表达式解释:
^sjs-E([2-9]\d|[1-9][7-9]|\d{3,})$
^ - asserts beginning of string
() - catching group
| - logical OR
$ - end of string
^sjs-E - starts with sjs-E
[2-9]\d - matches between 20 - 99
OR
1[7-9] - matches 17 - 19
OR
[1-9]{3,} - matches 100 and above
答案 1 :(得分:0)
getBatch()
&#13;
let result = [];
$('table tr td[id^="sjs-E"]').each(function(){
let ele = $(this);
//extracting last two digits of id
let digits = ele.attr('id').slice(-2);
if(!isNaN(digits) && digits >= 17){
result.push(ele.html());
}
});
console.log(result);
&#13;
答案 2 :(得分:-1)
var test_array = [];
var isGreaterThan = 17;
var until = 1000; // i don't know
for (var i=isGreaterThan; i < until; i++) {
var html = document.getElementById('sjs-E' + i.toString());
if (html) {
test_array.push(html.innerText);
}
}