Minulla on 2 HTML-tiedostoa, oletettavasti a.html
ja b.html
. Haluan sisällyttää tiedostoon a.html
tiedoston b.html
.
JSF:ssä voin tehdä sen näin:
<ui:include src="b.xhtml" />
Se tarkoittaa, että a.xhtml
-tiedoston sisällä voin sisällyttää b.xhtml
-tiedoston.
Miten voimme tehdä sen *.html
-tiedostossa?
Mielestäni paras ratkaisu on jQuery:
a.html
:
<html>
<head>
<script src="jquery.js"></script>
<script>
$(function(){
$("#includedContent").load("b.html");
});
</script>
</head>
<body>
<div id="includedContent"></div>
</body>
</html>
b.html
:
<p>This is my include file</p>
Tämä menetelmä on yksinkertainen ja siisti ratkaisu ongelmaani.
JQueryn .load()
dokumentaatio on täällä.
Ratkaisuni on samankaltainen kuin lolo edellä. Asetan kuitenkin HTML-koodin JavaScriptin kautta's document.write jQueryn käytön sijasta:
a.html:
<html>
<body>
<h1>Put your HTML content before insertion of b.js.</h1>
...
<script src="b.js"></script>
...
<p>And whatever content you want afterwards.</p>
</body>
</html>
b.js:
document.write('\
\
<h1>Add your HTML code here</h1>\
\
<p>Notice however, that you have to escape LF's with a '\', just like\
demonstrated in this code listing.\
</p>\
\
');
Syy siihen, että vastustan jQueryn käyttöä, on se, että jQuery.js on kooltaan ~90kb, ja haluan pitää ladattavan datan määrän mahdollisimman pienenä.
Saadaksesi oikein eskapatun JavaScript-tiedoston ilman suurempaa työtä, voit käyttää seuraavaa sed-komentoa:
sed 's/\\/\\\\/g;s/^.*$/&\\/g;s/'\''/\\'\''/g' b.html > escapedB.html
Tai käytä vain seuraavaa kätevää bash-skriptiä, joka on julkaistu Gistissä Githubissa ja joka automatisoi kaiken tarvittavan työn ja muuntaa b.html
-tiedoston b.js
-tiedostoksi:
https://gist.github.com/Tafkadasoh/334881e18cbb7fc2a5c033bfa03f6ee6
Kiitokset Greg Minshallille parannetusta sed-komennosta, joka myös poistaa takaisinviivoja ja yksinkertaisia lainausmerkkejä, joita alkuperäinen sed-komentoni ei ottanut huomioon.
Vaihtoehtoisesti selaimissa, jotka tukevat template literals, toimii myös seuraava:
b.js:
document.write(`
<h1>Add your HTML code here</h1>
<p>Notice, you do not have to escape LF's with a '\',
like demonstrated in the above code listing.
</p>
`);
Vaihtoehtoisesti, jos sinulla on pääsy palvelimesi .htaccess-tiedostoon, voit lisätä yksinkertaisen direktiivin, joka sallii php:n tulkinnan tiedostoihin, joiden pääte on .html.
RemoveHandler .html
AddType application/x-httpd-php .php .html
Nyt voit käyttää yksinkertaista php-skriptiä muiden tiedostojen sisällyttämiseen, kuten esim:
<?php include('b.html'); ?>