在javascript中加載大量的html

如何在JavaScript中加載大量的HTML？我會在下面顯示一個片段。我想把所有的HTML都放到java中的「ALL HTML GOES HERE」空間中。我知道你可以放入更小的東西，比如<h1>Hello!</h1>，但是我無法弄清楚如何在它的工作中將所有這些都放到那裏。除非有另一種方式來做到這一點，讓我知道。相反，把HTML的JavaScript字符串的在javascript中加載大量的html

function validate() { 
 
    var x = $('#in').val(); 
 

 
    if (navigator.userAgent.indexOf("Chrome") != -1) { 
 
     $('#id').html('ignore'); 
 
    } else { 
 
     $('#id').html('ALL HTML GOES HERE'); 
 
    } 
 

 
    } 
 
    window.onload = validate;

<div id="popup" class="overlay"> 
 
    <div class="popup"> 
 
    <a class="close" href="javascript:popupClose();">×</a> 
 
    <div class="content"> 
 
    </div> 
 
    </div> 
 
</div>

來源

2016-01-08 Akidus

'$（「＃」）'應該是什麼？ '＃'後面跟着一個元素ID。 – Barmar

只是一個ID。我把它放在＃中。 – Akidus

您可以儘可能多地代替「所有HTML GOES HERE」。 – Barmar

，如果你不想寫所有的HTML裏面'，你可以加載使用Ajax HTML文檔，所以首先你需要創建文件

allhtml.html

方含你的HTML，並有代替你：

$('#id').html..

你會使用

$('#id').load('allhtml.html')

來源

2016-01-08 23:47:27

，把它放在網頁的HTML，但display: none;風格隱藏它。然後你可以將它複製到#id。

function validate() { 
 
    var x = $('#in').val(); 
 

 
    if (navigator.userAgent.indexOf("Chrome") != -1) { 
 
    $('#id').html('ignore'); 
 
    } else { 
 
    $('#id').html($("#allhtml").html()); 
 
    } 
 

 
} 
 
window.onload = validate;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="popup" class="overlay"> 
 
    <div class="popup"> 
 
    <a class="close" href="javascript:popupClose();">×</a> 
 
    <div class="content"> 
 
    </div> 
 
    </div> 
 
</div> 
 

 
<div id="allhtml" style="display: none;"> 
 
    <div> 
 
    ALL HTML GOES HERE 
 
    </div> 
 
</div>

來源

2016-01-08 23:42:33 Barmar

你可以只通過它的整個字符串：

function validate() { 
    var x = $('#in').val(); 
    var htmlString = '<div id="popup" class="overlay">'; 
    htmlString += '<div class="popup">'; 
    htmlString += '<a class="close" href="javascript:popupClose();">×</a>'; 
    htmlString += '<div class="content"></div></div></div>'; 

if (navigator.userAgent.indexOf("Chrome") != -1) { 
    $('#id').html('ignore'); 
} else { 
    $('#id').html(htmlString); 
}

來源

2016-01-08 23:42:55

-1

一種選擇，可以幫助：

你可以把所有的HTML在一個單獨的HTML文件並使用JQuery的.load（'anotherpage.html'....）方法。基本上，你只需要這樣調用：$（'＃id）.load（'....'）;

這裏是舉例 http://api.jquery.com/load/

來源

2016-01-08 23:46:12 Araymer