0

ホームページでは、JS はニュース ページから最大 3 つのニュース記事を取得し、全文にリンクする短縮版を表示します。私が直面している問題は、連結しようとしている変数の 1 つが意図したとおりに連結されていないことです。

ホームページ:

<div id="news-autoloader">

</div>

ニュースページ:

<h3 id="news1">News Item 1</h3>

<p>Lorem ipsum dolor sit amet...</p>

<h3 id="news2">News Item 2</h3>

<p>Lorem ipsum dolor sit amet...</p>

// more or less of the same news items

ニュースページには項目がないかもしれませんが、h3 見出しに続く最初の p のうち、最初に見出し、次に n 文字 (むしろ n 単語をキャプチャしたいのですが、それはこの問題が解決された後です!) まで最大 3 つキャプチャします。

<script>
$.get('company-news.html',
    function(data){
        var news1 = $(data).find('#news1 + p');
        var news2 = $(data).find('#news2 + p');
        var news3 = $(data).find('#news3 + p');

// see how many news items there are (there's probably a more graceful way of doing this!):

    if (news1.html() == null){
        var items = 0;
    } else if (news2.html() == null){
        var items = 1;
    } else if (news3.html() == null){
        var items = 2;
    } else {
        var items = 3;
    }

    if (items == 0){
        $('#news-autoloader').append('<h3>No News.</h3>');
    } else {
        for (i=1; i<=items; i++){
            var abc = '#news' + i;
            var def = 'news' + i;
            var url   = 'a href="company-news.html#news' +i;

            $('#news-autoloader').append($(abc,data)).append('<p>' + def.html().substr(0, 175) + ' <' + url + '">More</a></p>');
        }
    }
}, 'html');
</script>

すべてが機能します -abc最初の追加では正しく評価されますが、2 回目の追加では variableは正しく評価されdefません。

以下の3点が知りたいです。

def1） 2番目の追加で作業するにはどうすればよいですか

2) ニュース項目の数を見つけるより優雅な方法はありますか?

3) 文字数ではなく単語数で制限するにはどうすればよいですか (省略された文が完成します)。

ティア!!!

4

2 に答える 2

2

あなたの問題は、あなたが呼び出したもの...def.html()....でありdef、jQuery オブジェクトでも要素でもないことです。むしろ、 の値はdefです'news' + i。ここiで、 は反復回数です。

idofを使用して要素から HTML を取得するつもりだった場合はnews、 の値を に変更してから、jQuery オブジェクト , 関数にラップする必要defがあります'#news' + i。def$(def)

...$(def).html()....


アップデート

news1もう一度誤解した場合、変数、news2および をレンダリングしたい場合news3は、それらの変数を配列に入れる必要があります。

JavaScript では、配列を使用せずに文字列から変数を参照することはできません。

この場合、更新されたコードは次のようになります。

<script>
$.get('company-news.html',
    function(data){
        var newsData = [];
        newsData["news1"] = $(data).find('#news1 + p');
        newsData["news2"] = $(data).find('#news2 + p');
        newsData["news3"] = $(data).find('#news3 + p');

// see how many news items there are (there's probably a more graceful way of doing this!):

    if (newsData["news1"].html() == null){
        var items = 0;
    } else if (newsData["news2"].html() == null){
        var items = 1;
    } else if (newsData["news3"].html() == null){
        var items = 2;
    } else {
        var items = 3;
    }

    if (items == 0){
        $('#news-autoloader').append('<h3>No News.</h3>');
    } else {
        for (i=1; i<=items; i++){
            var abc = '#news' + i;
            var def = 'news' + i;
            var url   = 'a href="company-news.html#news' +i;

            $('#news-autoloader').append($(abc,data)).append('<p>' + $(newsData[def]).html().substr(0, 175) + ' <' + url + '">More</a></p>');
        }
    }
}, 'html');
</script>
于 2013-04-13T03:49:44.190 に答える