0

ドキュメントをサイトに追加するときに数値を編集する手間を省くために、javascript を使用して class で要素の数をカウントすることにしましたdoc。

私は2つの主な問題です：

  • 変数の表示に問題があります。最初は を追加していないためだと思っていましたがfunction、これを追加しようとすると、変数はまだ表示されませんでした。

  • カウントしたいクラスの要素が別のページにあり、リンクする方法がわかりません。このために、私var x = $('URL: /*pageURL*/ .doc').length;はうまくいかなかったものを試しました。

基本的に、上記のクラス名を持つ要素の合計と、これをスパン要素に表示する必要があります。

現在、以下に表示されているものに似たものがあります。

 <script>
 var Items = $('.doc').length;
 document.getElementById("display").innerHTML=Items;
 </script>
 <span id="display"></span>

ここで、記事の総数が表示されているのと同様の例を見つけました。

編集：

@ian このコードは、ホームページ domain.net/home.html に追加されます。このドキュメントを含むページ domain.net/documents.html にリンクしたいと思います。私はこれが以前にどこかで行われたのを見たことがあります.私の記憶が正しければurl:domainname.com/count、彼らはコードのどこかで使用していました. お役に立てれば。

4

2 に答える 2

2

これは、URL「./」(このページ) を取得し、クラス「lsep」「$('.lsep', data)」を持つすべての要素の結果データを解析する jQuery 呼び出しです。ブラウザのデバッグ コンソールからこれを実行すると、5 以上の数値が返されるはずです。

$.get("./", function(data, textStatus, jqXHR)
{
    console.log("Instances of class: " + $('.lsep', data).length)
});

覚えておくべき重要なことの 1 つは、呼び出しようとしている URL が同じオリジンにない場合に問題が発生することです。

あなたが説明していることを行うためのコードの更新されたスニペットは次のとおりです。

$(document).ready(
    function ()
    {
      //var url = "/document.html" //this is what you'd have for url
      //var container = $("#display"); //this is what you'd have for container
      //var className = '.data'; //this is what you'd have for className

        var url = "./"; //the document you want to parse
        var container = $("#question-header"); //the container to update
        var className = '.lsep'; //the class to search for

        $.get(url, function (data, textStatus, jqXHR) {
            $(container).html($(className, data).length);
        });
    }
);

上記のコードをブラウザのデバッグ コンソールから実行すると、質問のヘッダー テキスト「Counting classes on another page anddisplay them 」が、クラス名「.lsep」が使用されているインスタンスの数に置き換えられます。

于 2013-04-19T19:32:53.553 に答える
1

まず、操作する要素の定義の後にコードが配置されていない限り、要素をdocument操作する前に準備が整うまで待つ必要がありますが、これはあなたの例では当てはまりません。に を渡すと、ドキュメントの準備ができたときにのみ実行されます。DOMfunction$

$(function () {
    //html() allows to set the innerHTML property of an element
    $('#display').html($('.doc').length);
});

要素が別の に属している場合document、それは明らかに機能しません。ただし、要素window.openを含むドキュメントを保持する別のウィンドウを開いている場合は、上記のスクリプトをそのページに配置し、親のウィンドウでを参照すること.docに依存できます。window.openerspan

$('#display', opener.document.body).html($('.doc').length);

もう 1 つの方法は、ajaxを使用して他のページのコンテンツにアクセスすることです。ここにdataはドキュメントの HTML が含まれ、your_other_page.htmljQuery を使用して DOM 構造のように操作できます。

$.get('your_other_page.html', function(data) {
    $('#display').html($('.doc', data).length);
});
于 2013-04-19T19:38:15.313 に答える