我有一個JSON對象，現在我怎麼做一個div元素

我使用的getJSON一些信息，以拉動到頁面我有一個JSON對象，現在我怎麼做一個div元素

$('#request_song').autocomplete({ 
    serviceUrl: '<%= ajax_path("trackName") %>', 
    minChars:1, 
    width: 300, 
    delimiter: /(,|;)\s*/, 
    deferRequestBy: 0, //miliseconds 
    params: { artists: 'Yes' }, 
onSelect: function(value, data){ 
    // alert('You selected: ' + value + ', ' + $('#request_artist').val()); 
     $.getJSON('/get_events', function(data) { 
        $(data).each(function(key, value) { 
         console.log(value); 
        }); 
       }); 

    }, 
});

的JSON將有事件的名稱和城市日期

我需要做一個有一個的div在頁面上已經從JSON值就像在參數$()從它創建一個元素

<div id="event_data"> 

//table info from json

來源

2010-09-11 Trace

我猜你的迴應看起來是這樣的......

var data = [{ 
    "event": "Birthday" 
    "name": "John Doe", 
    "city": "Sunnyvale", 
    "date": "04/07/1982" 
},{ 
    ... 
}]

如果使用$('<div />')或$('<div></div>')創建新的元素，jQuery將使用正則表達式創建元素之前，其原因很明顯會讓你放慢如果您正在處理大型數據集，請停止。

出於性能方面的用途：

var div = $(document.createElement('div')); 

or keep it simple... 

var div = document.createElement('div');

爲循環使用的性能標準，沒有。每個$，並緩存長度：

var container = $("#event_data"); 

for(var i = 0, k = data.length; i < k; i++){ 
    var event = $(document.createElement('div')), 
     name = $(document.createElement('span')), 
     city = $(document.createElement('span')), 
     date = $(document.createElement('span')); 

    // add id to event wrapper, if undefined generate random ID to avoid conflicts 
    event.attr('id', 'event_'+data[i].event || Math.floor(Math.random()*100)); 

    // add each item, if undefined then insert empty text 
    name.text(data[i].name || "").appendTo(event); 
    city.text(data[i].city || "").appendTo(event); 
    date.text(data[i].date || "").appendTo(event); 

    // append & appendTo do exactly the same thing, markup preference 
    container.append(event); 
}

如果您使用文本（）的值將被視爲就像那樣，僅文字，並且不會被執行。如果您使用html（），您將遇到XSS問題。

希望這可以幫助您，並且您正在尋找。

來源

2010-09-13 05:31:37 Kieran

認沽標記。使用{}查找中的值來設置屬性和文本內容（在jQuery 1.4中）。例如。是這樣的：

$('#event_data').append(
    $('<div class="event"/>', {id: 'event_'+key}).append(
     $('<span class="event-name"/>', {text: value.name}) 
     $('<span class="event-city"/>', {text: value.city}) 
     $('<span class="event-date"/>', {text: value.date}) 
    ) 
);

不要粘在一起自己動手（$('<span>'+value.name+'</span>')），或者你有HTML編碼的問題和可能的跨站腳本安全漏洞。

來源

2010-09-11 19:34:31 bobince

我有一個JSON對象，現在我怎麼做一個div元素

回答

相關問題