在网页上添加已加载记录的新记录

假设预加载的div已经像新生成的div一样分配了id，那么在$（"body"）.append部分之前，您可以设置if条件来检查当前div是否已经存在。类似这样的东西：

function updates() {
  var url="http://192.168.0.102/newsget.php";
  $.getJSON(url,function(json){
  // loop through the members here
  $.each(json.members,function(i,dat){
    if ($("#"+dat.pagename).length === 0) { // New if condition!
      $("body").append(...

有点脏，但我希望它能帮上忙。

附言：我建议你适当地缩进你的代码！

// My Model
var Model = {
    url: 'your/url/here.php',
    content: [{
        id: 9087,
        foo: 'foo'
    }, {
        id: 9088,
        foo: 'foo'
    }],
    getNewData: function () {
        $.getJSON(this.url, this.addNewRecords);
    },
    addNewRecords: function (arr) {
        // important to distinguish JSON from JSOL
        var i = 0;
        for (i; i < arr.length; i += 1) {
            if (!this.keyValueInModel('id', arr[i].id)) {
                Model.content.push(arr[i]);  // push the record into your model
                myView.render([arr[i]]); // render the record to the view
            }
        }
    },
    keyValueInModel: function (key, val) {
        var i = 0,
            result = false,
            arr = Model.content;
        for (i; i < arr.length; i += 1) {
            if (arr[i][key] === val) {
                return true;
            }
        }
        return false;
    }
};

// My View
var myView = {
    context: null, // +1 if you figure out why you should context your view to a specific node, and actually do it. I figure I will leave you some room to learn....

    render: function (records) {
        var i = 0,
            dat;
        for (i; i < records.length; i += 1) {
            dat = records[i];
            $("body").append(
                '<div data-role="page" id="' + dat.pagename + '" data-title="' + dat.pagename + '">' +
                '<div data-role="header">' +
                '<h1>' + dat.post_title + '</h1>' +
                '<a data-role="button" href="#news" data-transition="flip" data-icon="arrow-l" data-corners="false">Back</a>' +
                '</div>' +
                '<div data-role="content">' +
                '<img src="http://192.168.0.102/uploads/' + dat.imageurl + '" alt="' + dat.post_title + '" />' +
                '<p>' + dat.description + '</p>' +
                '</div>' +
                '<div data-role="footer">' +
                '<h2>Copyrights All rights Reserved by ABC</h2>' +
                '<p class="copyright">&copy; Copyright 2015</p>' +
                '</div>' +
                '</div>');
        }
        $("#grid").append(
            '<li data-corners="false" data-shadow="false" data-iconshadow="true" data-wrapperels="div" data-icon="false" data-iconpos="right" data-theme="c" class="portfolio-item ui-btn ui-btn-icon-right ui-li ui-li-has-alt ui-li-has-thumb ui-first-child ui-btn-up-c ui-corner-none"><div class="ui-btn-inner ui-li ui-li-has-alt">' +
            '<div class="ui-btn-text">' +
            '<a href="#' + dat.pagename + '" class="ui-link-inherit ui-corner-none">' +
            '<img src="http://192.168.0.102/uploads/' + dat.imageurl + '" class="ui-li-thumb ui-corner-none">' +
            '<h3 class="ui-li-heading">' + dat.post_title + '</h3>' +
            '<p class="ui-li-desc">' + dat.post_content + '</p>' +
            '</a>' +
            '</div>' +
            '</div>' +
            '<a href="#portfolio1" title="Purchase album" class="ui-li-link-alt ui-btn ui-btn-icon-notext ui-btn-up-c" data-corners="false" data-shadow="false" data-iconshadow="true" data-wrapperels="span" data-icon="false" data-iconpos="notext" data-theme="c">' +
            '<span class="ui-btn-inner"><span class="ui-btn-text">' +
            '</span>' +
            '<span data-corners="true" data-shadow="true" data-iconshadow="true" data-wrapperels="span" data-icon="arrow-r" data-iconpos="notext" data-theme="b" title="" class="ui-btn ui-btn-up-d ui-shadow ui-btn-corner-all ui-btn-icon-notext"><span class="ui-btn-inner"><span class="ui-btn-text"></span><span class="ui-icon ui-icon-arrow-r ui-icon-shadow">&nbsp;</span></span></span></span></a>' +

            '</li>'


        );
    }
};
setTimeout(Model.getNewData, 2000);