Question

是否可以完全重写div中的内容而不是使用prependTo并添加到最新的？我应该使用什么jQuery函数？

$(function() {
    function log( message ) {
      $( "<div/>" ).text( message ).prependTo( "#log" );
      $( "#log" ).attr( "scrollTop", 0 );
    }

    $.ajax({
      url: "london.xml",
      dataType: "xml",
      success: function( xmlResponse ) {
        var data = $( "geoname", xmlResponse ).map(function() {
          return {
            value: $( "name", this ).text() + ", " +
              ( $.trim( $( "countryName", this ).text() ) || "(unknown country)" ),
            id: $( "geonameId", this ).text()
          };
        }).get();
        $( "#match" ).autocomplete({
          source: data,
          minLength: 0,
          select: function( event, ui ) {
            log( ui.item ?
              "Selected: " + ui.item.value + ", geonameId: " + ui.item.id :
              "Nothing selected, input was " + this.value );
          }
        });
      }
    });
  });

<div id="log" style="height: 200px; width: 300px; overflow: auto;" class="ui-widget-content"></div>

Answer 1

您可以使用.html()重写DOM元素的内部HTML。我会重写你的功能：

function log( message ) {
  $( "#log" ).html( $( "<div/>" ).text( message ) ).attr( "scrollTop", 0 );
}

如果您想要剥离HTML，请使用.text()，因此您的函数会重写为：

function log( message ) {
  $( "#log" ).text(message);
}

Answer 2

要完全重写，您可以使用.html()

.html();

Answer 3

是的，这是可能的。

更改

$( "<div/>" ).text( message ).prependTo( "#log" );

到

$("#log" ).html( "<div>"+message+"</div>" );

不使用prependTo但完全刷新div

3 个答案: