2016-12-08 20 views
1

我正在寫一個簡單的腳本,將一些體育數據擦掉並放在頁面頂部的表格中。然而,並不是將每個團隊名稱放在自己的行中,而是將每個單詞分成單獨的字母並將它們放在行中。Greasemonkey刮板代碼抓取字母而不是單詞?

來源HTML:

<span class="team-title" id="firstTeamName">Oakland Raiders</span> 

示例代碼:

$(document).ready(function() { 

$('#navFixed').after('<table id="tbone"></table>'); //navFixed is just an element at the top of the page 

var team1 = $('span#firstTeamName').text(); 

for (var i = 0; i < team1.length; i++) { 
    var txt = $('<tr><td></td></tr>').text(team1[i]); 
    $('#tbone').append(txt); 
    } 
}); 

樣本HTML輸出:

<table id="tbone"> 
    <tr><td>O</td></tr> 
    <tr><td>a</td></tr> 
    <tr><td>k</td></tr> 
    <tr><td>l</td></tr> 
    ... 
</table> 

理想輸出:

<table id="tbone"> 
<tr>Oakland Raiders</tr> 
</table> 

有什麼想法?

回答

2

.text() returns a string,這就是你想要的。通過字符串循環產生單個字母。不要這樣做。 ;)

我懷疑你想循環通過團隊。通過選擇所有.team-title節點並通過jQuery's .each()循環來完成。
看到這個代碼:

$("button").click (function() { 
 
    //--- Greasemonkey javascript follows... 
 
    var targTble = $('<table id="tbone"></table>').insertAfter ("#navFixed"); 
 
    var teams  = $(".team-title"); 
 

 
    teams.each (function() { 
 
     var teamName = $(this).text().trim(); //-- Always beware of whitespace 
 
     targTble.append ('<tr><td>' + teamName + '</td></tr>'); 
 
    }); 
 
    //--- End of Greasemonkey javascript. 
 
    this.disabled = true; 
 
});
.team-title {background: #ddd; font-size: 80%;} 
 
table {border-collapse: collapse;} 
 
table, td {border: 1px solid green;}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> 
 
<span id="navFixed"></span><br> 
 
<span class="team-title" id="firstTeamName">Oakland Pirates</span><br> 
 
<span class="team-title" id="firstTeam_02"> San Fran Gold diggers</span><br> 
 
<span class="team-title" id="firstTeam_03"> Dallas Cow pokes</span><br> 
 
<button>Run Greasemonkey code</button>