JavaScript HTML表格解析 [英] JavaScript HTML table parsing

问题描述

HTML

 < table id =table> 
< tr> 
< td> 1999.09-2007.06< / td> 
< td>中学< / td> 
< / tr> 
< tr> 
< td> 2007.09-2011.06< / td> 
< td>学院< / td> 
< / tr> 
< tr> 
< td> 2011.09-2015.06< / td> 
< td>大学< / TD> 
< / tr> 
< / table> 
 
 
< form autocomplete =on> 
< p /> 
< label>年< / label> 
< input type =textid =yearname =yearautofocus /> 
< p /> 
< label>月份< / label> 
< input type =textname =monthid =month/> 
< p /> 
< / form> 
< input type =buttononClick =method（）/> 
  

JavaScript

  function method（）{
 var year = document.getElementById（year）。value; 
 var month = document.getElementById（month）。value; 
 var data = new Date（year，month-1,1）; 
 var dataTable = document.getElementById（table）; 
 var cells = dataTable.querySelectorAll（td）; 
 var cells2 = dataTable.querySelectorAll（td + td）; 
 
 for（var i = 0; i< cells.length; i ++）{
 var mikro = cells [i] .firstChild.data.split（ - ）; 
 var place = cells2 [i] .firstChild.data; 
 var firstData = mikro [0] .split（。）; 
 var secondData = mikro [1] .split（。）; 
 var data1 = new Date（firstData [0]，firstData [1] -1,1）; 
 var data2 = new Date（secondData [0]，secondData [1] -1,1）; （数据1 <=数据&数据2> =数据）{
 alert（place）; 
 
 
 
 $ / code $ / pre 
 
这里我有2列我想创建脚本，这将帮助我从中找到信息：我有< input type =textid =yearname =yearautofocus /> 和< input type =textname =monthid =month/> 我可以输入year&月。输入年份和月份后，我必须根据第一列的日期从第二列中获取信息，例如：输入年份：2002年，输入月份：05  - 结果必须是'中学'，因为它在1999年9月9日之前-2007.06。我看不出我的脚本有什么问题，它总是给我提供虚假信息。
    试试这个（ jsfiddle ），每次增加单元格索引2，并使用更简单的 td  
 $ b 
 函数方法（）{
 var year = document.getElementById（year）。值; 
 var month = document.getElementById（month）。value; 
 var data = new Date（year，month  -  1，1）; 
 var dataTable = document.getElementById（table）; 
 var cells = dataTable.querySelectorAll（td）; （变量i = 0; i< cells.length; i + = 2）{
 var mikro = cells [i] .firstChild.data.split（ - ）; 
 
 
 var place = cells [i + 1] .firstChild.data; 
 console.log（mikro，place）; 
 var yearMonth1 = mikro [0] .split（。）; 
 var yearMonth2 = mikro [1] .split（。）; 
 var data1 = new Date（yearMonth1 [0]，yearMonth1 [1]  -  1，1）; 
 var data2 = new Date（yearMonth2 [0]，yearMonth2 [1]  -  1，1）; （数据1 <=数据&数据2> =数据）{
 alert（place）; 
} 
} 
} 
  
 
HTML
<table id="table">
<tr>
<td>1999.09-2007.06</td>
<td> Secondary School </td>
</tr>
<tr>
<td>2007.09-2011.06</td>
<td> College </td>
</tr>
<tr>
<td>2011.09-2015.06</td>
<td> University</td>
</tr>
</table>


<form autocomplete="on">
<p/>
<label>Year</label>
<input type="text" id="year" name="year" autofocus/>
<p/>
<label>Month</label>
<input type="text" name="month" id="month" />
<p/>
</form>
<input type="button" onClick="method()" />
JavaScript
function method(){
var year = document.getElementById("year").value;
var month = document.getElementById("month").value;
var data = new Date(year,month-1,1);
var dataTable = document.getElementById("table");
var cells = dataTable.querySelectorAll("td");
var cells2 = dataTable.querySelectorAll("td+td");

for (var i = 0; i < cells.length; i++){
    var mikro = cells[i].firstChild.data.split("-");
    var place = cells2[i].firstChild.data;
    var firstData = mikro[0].split(".");
    var secondData = mikro[1].split(".");
    var data1 = new Date(firstData[0],firstData[1]-1,1);
    var data2 = new Date(secondData[0],secondData[1]-1,1);
    if(data1<=data && data2>=data){     
        alert(place);
        }
    }
}
Here i have 2 columns in the table, i want to create script which will help me to find information from it: I have <input type="text" id="year" name="year" autofocus/> and <input type="text" name="month" id="month" /> where i can enter year & month.After entering year&month i have to get information from the 2nd column according to the dates on the 1st column for example: " Input year: 2002, Input month:05 - result must be 'Secondary School'" because it between 1999.09-2007.06 . I can't see what is wrong with my script, it always give me false information.
解决方案
Try this (jsfiddle), increment the cell index by 2 each time, and use the simpler td selector:
function method () {
    var year = document.getElementById("year").value;
    var month = document.getElementById("month").value;
    var data = new Date(year, month - 1, 1);
    var dataTable = document.getElementById("table");
    var cells = dataTable.querySelectorAll("td");

    for (var i = 0; i < cells.length; i+=2) {
        var mikro = cells[i].firstChild.data.split("-");
        var place = cells[i+1].firstChild.data;
        console.log(mikro, place);
        var yearMonth1 = mikro[0].split(".");
        var yearMonth2 = mikro[1].split(".");
        var data1 = new Date(yearMonth1[0], yearMonth1[1] - 1, 1);
        var data2 = new Date(yearMonth2[0], yearMonth2[1] - 1, 1);
        if (data1 <= data && data2 >= data) {
            alert(place);
        }
    }
}


                        
这篇关于JavaScript HTML表格解析的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！