使用javascript輸出html

我有一個JavaScript鏈接引用另一個.js文件。我一直在試圖輸出一個圖像（用於測試目的），但我不確定什麼是正確的方式去做這件事。使用javascript輸出html

alert("beginning"); 
    //var link = $("<a href='http://juixe.com'>Hello, <b>World</b>!</a>"); 
    //$('body').append(link); 
    //document.write("hi"); 
    //document.write("<div><img src='http://s3-media2.ak.yelpcdn.com/bphoto/xqC6Iy5mOLb_8mwMKGv8_w/l.jpg' /></div>"); 
    alert("before function"); 
(function(){ 



    alert("middle"); 
    var links = $("<a href='http://juixe.com'>Hello, <b>World</b>!</a>"); 
    $('body').append(links); 
    alert("after middle"); 
    //alert($("img").attr("id")); 
    document.write("hi"); 
    document.write("<div><img src='http://s3-media2.ak.yelpcdn.com/bphoto/xqC6Iy5mOLb_8mwMKGv8_w/l.jpg' /></div>"); 

    alert("end"); 
}());

我能夠提醒開始，一直到中間。好像var links不起作用。我試圖在.js文件中使用HTML。本質上，我想能夠做一些模態窗口，但我現在試圖輸出用於測試目的的圖像。

此外，這是jquery的正確方法？

在此先感謝！

來源

2012-06-24 hellomello

你的代碼是一個奇怪的組合。 Jquery代碼幾乎總是需要在頁面加載後運行，而document.write在頁面加載後永遠不能使用。

你錯誤地將你的jQuery包裝在即時執行函數中。 jQuery的正確的紙包內：

$(document).ready(function(){ 
    /* html of page exists now, run jQuery here */ 
});// notice no extra "()" after close brace as you have

或簡寫版，做同樣的事情：

$(function(){ 
    /*html of page exists now, run jQuery here */ 
});// notice no extra "()" after close brace as you have

如果你改變你所有的document.write到$('body').append(/* your content*/)，並放置在上述包裝內的所有你的代碼將會有更好的成功。

jQuery文檔和API中有豐富的信息。關於我已經展示的包裝的更多細節的一個很好的起點可以在這裏找到：http://docs.jquery.com/How_jQuery_Works

來源

2012-06-24 00:46:49 charlietfl

「在加載頁面後永遠不能使用document.write」。我只是試圖在控制檯中，看起來像它可以使用，但取代整個頁面:) – sabithpocker

@sabithpocker剛好點 – charlietfl

剛剛閱讀此，https://developer.mozilla.org/en/document.write它顯示了一個例子頁面加載後用document.write替換頁面。只是好奇你的評論;） – sabithpocker

你的最大的問題是解決在其他答案。你不恰當地包裝JQUery，所以基本上JQuery在它到達append聲明時還沒有準備好執行。

是不必要的包裝在一個jQuery對象的HTML（在這種情況下）：

var links = "<a href='http://juixe.com'>Hello, <b>World</b>!</a>"; 
$('body').append(links);

或者乾脆：

$('body').append("<a href='http://juixe.com'>Hello, <b>World</b>!</a>");

在最佳實踐方面，採用append，appendTo或prepend根據具體情況是很好的選擇。你也可以使用：

$("body").html("/*Your HTML here*/")

在一天結束時，你有很多選擇，但不惜一切代價避免document.write。非JQuery方法將使用帶有DOM元素的.innerHTML。在沒有JQuery的情況下，這也是一個好方法。

來源

2012-06-24 00:54:17 marteljn

實際上沒有錯誤，如果你想在附加前附加事件或數據，在jQuery中包裝'links' html。我意識到這不是OP所做的，在他的情況下是額外的函數調用...但它的工作原理完全相同 – charlietfl

您的權利，問題是您如何不正確地包裝JQuery代碼，我將編輯我的文章。 – marteljn

而對於語法警察，我注意到我的你 - 你使用錯誤，以至於遲來做一個編輯。 – marteljn

使用javascript輸出html

回答

相關問題