2

この質問は、この質問のフォローアップであることに注意してください

次のコード (多かれ少なかれ - データは定期的に変更されます) がページに表示されます。

<div class="weather-feed">
    <img src="http://l.yimg.com/a/i/us/we/52/28.gif"/><br />
    <b>Current Conditions:</b><br />
    Mostly Cloudy, 19 C<BR />
    <BR /><b>Forecast:</b><BR />
    Tue - PM Thunderstorms. High: 26 Low: 16<br />
    Wed - Mostly Sunny. High: 27 Low: 16<br />
    <br />
    <a href="http://us.rd.yahoo.com/dailynews/rss/weather/Pretoria__SF/*http://weather.yahoo.com/forecast/SFXX0044_c.html">Full Forecast at Yahoo! Weather</a><BR/><BR/>
    (provided by <a href="http://www.weather.com" >The Weather Channel</a>)<br/>
</div>

これをスタイルしたいので、<div>各セクションの周りに s を追加して、レンダリングされた HTML を変更するというアイデアがありました (目的のコードは前の質問へのリンクにあります。

私は次のjqueryを作成して（さまざまな人々からの多くの助けを借りて）、現在の場所に到達しました。

$(document).ready(function() {
    var src = $(".weather-feed");

    // remove line feeds
    var result = src.find("br").remove();


    //var condition = src.html().match(/<b>Current Conditions:<\/b>([^<]*)<b>/)[1].trim());

    // modify weather icon
    result += "<div class=\"weather-icon\"><img src=\"" + src.find("img").attr("src") + "\" /></div>";

    // modify weather conditions
    result += src.find("b:nth-child(1)").before("<div class=\"weather-conditions\">") + ;
    result += src.find("b:eq(1)").before("</div><div class=\"weather-forecast\">");
    result += src.find("a:nth-child(1)").before("</div><div class=\"weather-detail\">");
    result += src.find("a:nth-child(1)").after("</div");

    $("#weather-feed").append(result);
});

ただし、現在、レンダリングしているのは次のとおりです。

[オブジェクト オブジェクト]
画像
[オブジェクト オブジェクト][オブジェクト オブジェクト][オブジェクト オブジェクト][オブジェクト オブジェクト]

ここでjqueryが何をしているのか、私は本当に理解していません。私の目標は、基本的に html の文字列表現を取得し、html を変更された文字列に置き換えることでした。

私にはどのように見えるかというと、リテラルの html を取得して、それをページにスローしているように見えますが、実際にはわかりません。

では、このコードを変更して、必要な場所から html コードを書き込むにはどうすればsrcよいresultでしょうか?

4

3 に答える 3

4

さらに処理するには、html コンテンツを取得する必要があります。

var src = $(".weather-feed").html();
于 2013-03-12T11:34:20.860 に答える
0

あなたが抱えている問題は、オブジェクトを文字列に追加しているため、オブジェクトの文字列表現を取得していることです。

持っているものを次のように変更します。

$(document).ready(function() {
    var src = $(".weather-feed");
    var result = src.find("br").remove();
    result += "<div class=\"weather-icon\"><img src=\"" + src.find("img").attr("src") + "\" /></div>";
    result += src.find("b:nth-child(1)").before("<div class=\"weather-conditions\">").html();
    result += src.find("b:eq(1)").before("</div><div class=\"weather-forecast\">").html();
    result += src.find("a:nth-child(1)").before("</div><div class=\"weather-detail\">").html();
    result += src.find("a:nth-child(1)").after("</div").html();
    $("#weather-feed").append(result);
});

このようにして、各要素内にある HTML コンテンツを文字列に追加します。これが、探している結果です。

于 2013-03-12T11:38:53.793 に答える
0

文字列と一連の jQuery オブジェクトを連結しようとしています。.toString()JavaScript は、 を返す上記のオブジェクトの関数を呼び出している[Object object]ため、それを行うことができます。

于 2013-03-12T11:37:29.547 に答える