1

これはおそらく非常に簡単/明白であり、ピースをまとめていないだけなので、かなりイライラしています。テーブル内の各 URL を調べ、各 URL の一部 (エントリごとに一意) を抽出し、各エントリの後に表示される新しいリンクを挿入する GM スクリプトを作成しようとしています。

HTML がどのように表示されるかの例を次に示します。

<table border="1" cellpadding="1" cellspacing="0" width="400">
<tbody>
<tr>
    <td>
        <a href="http://website.com/names/1936">joseph smith</a>
    </td>
    <td>11</td>
</tr>
<tr>
    <td>
        <a href="http://website.com/names/1756">john smith</a>
    </td>
    <td>1</td>
</tr>
<tr>
    <td>
        <a href="http://website.com/names/350466">scott smith</a>
    </td>
    <td>0</td>
</tr>
<tr>
    <td>
        <a href="http://website.com/names/789533">adam smith</a>
    </td>
    <td>6</td>
</tr>
</tbody>
</table>

各エントリについて、"/names/" の後に続く番号を識別したいと思います。これは各名前に固有であり、常に同じ長さであるとは限りません。次に、次のように、既存のリンクの後に新しいリンクを挿入したいと思います。

<a href="http://website.com/names/[number]/edit">[number]</a>

それがどのように見えるかの基本的な例として、私はこれが欲しいです(各エントリについて):

<tr>
    <td>
        <a href="http://website.com/names/1936">joseph smith</a> <a href="http://website.com/names/1936/edit">1936</a>
    </td>
    <td>11</td>
</tr>

どんな助けでも大歓迎です。私が言ったように、私は少し密度が高いように感じます。これは、私が思っているよりもずっと単純であるべきだと思います。私は何日もそれを理解しようとしてきましたが、どこにもたどり着けないようです (私はまだ JavaScript に完全に習熟していません!)。

更新: 明確にするために、私の困難は次の 3 つのことだと私が信じていることを行うことです。これらの各リンクの後のリンク

たとえば、ID を指定するために、既にそこにある HTML コードを変更することはできません。

4

3 に答える 3

1

ここでは、jQueryの使用は問題ないと想定します。私はこれをかなり冗長にコメントして、各ステップで何が起こっているかについての良い考えを与えるようにしました

// Get all <a> tags within the table and loop over them
$("table a").each( function() {
    // Get the url this <a> tag points to
    var url = $(this).attr("href");

    // Parse the id using regex (find a string of numbers following a "/"
    var userId = url.replace( /.*\/(\d+).*/, "$1" );

    // Create the new, desired, url
    var newUrl = "http://website.com/names/" + userId + "/edit/";

    // Append the new link after this <a> tag
    $(this).after( "<a href='" + newUrl + "'>" + userId + "</a>" );
} );

お役に立てれば。ご不明な点がございましたらお知らせください。

于 2012-06-15T22:16:16.733 に答える
1

これは、 jQueryを使用してこれを行う方法を示す完全なスクリプトであり、見栄えを良くするために CSS スタイルを使用します。

// ==UserScript==
// @name     _Add edit links after user links
// @include  http://YOUR_SERVER.COM/YOUR_PATH/*
// @require  http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js
// @grant    GM_addStyle
// ==/UserScript==

//--- This next selector is highly page-specific.
var nameLinks   = $("td a[href*='names']");
nameLinks.each ( function () {
    /*---   From: <a href="http://website.com/names/1756">john smith</a>
            Make: <a href="http://website.com/names/1756/edit">Edit user 1756</a>
            (Plus some housekeeping.)
    */
    var newURL  = this.href.replace (/names\/(\d+)$/i, "names/$1/edit");
    var userNum = RegExp.$1;    // Special feature of replace().

    $(this).after (
        '<a href="' + newURL + '" class="gmEditLink">Edit user ' + userNum + '</a>'
    );
} );

GM_addStyle ( '                         \
    a.gmEditLink {                      \
        margin-left:            1em;    \
        font-size:              80%;    \
        vertical-align:         super;  \
    }                                   \
' );
于 2012-06-16T00:50:43.127 に答える
1
var slash=str.lastIndexOf("/");
var number=str.slice(slash);

ここで、str は URL を含む文字列です。最初の行は文字列の最後の / の位置を取得し、2 行目はその / のインデックスから文字列の最後まで文字列をスライスし、URL の / の後のすべてを提供します。

「number」は、それらの数字を表す変数になります

テーブルに ID、id="mytable" を与えます。これを機能させるには、jQuery ライブラリを含める必要があります。

$('#mytable tr').each(function() {
    var url= $(this).find("td:first").html();
    //at this point url holds the contents of the entire td

});

.. 次に、一連の「lastIndexOf」および「slice」ステートメントを使用して、URL の周囲の領域をトリミングし、必要な情報を分離できます。

これを試して、

var count = 1
$('table').each(function(){
   (this).attr("id", "table"+count);
   count++;
});

これにより、ページ上の各テーブルに ID が割り当てられます。したがって、最初のテーブルの ID は table1 になり、2 番目のテーブルは table2 になります。

次に、関数を使用できます(必要な2番目のテーブルであると想定しています)、

$('#table2 tr').each(function() {
    var url= $(this).find("td:first").html();
    //at this point url holds the contents of the entire td
});

そして、上記のように、indexOf 関数とスライス関数を使用して数値を分離します。

于 2012-06-15T16:29:25.077 に答える