Greasemonkeyスクレーパーコードは単語の代わりに文字をつかまえますか？

Question

私はいくつかのスポーツデータを拾い読みし、それをページの上部にあるテーブルに配置する簡単なユーザースクリプトを作成しています。しかし、各チーム名をそれ自身の行に配置する代わりに、各単語を個々の文字に分割して行に配置します。

ソース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> 

どのような考えですか？

Answer 1

.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>

：
は、このコードを参照してください。