Cita HTML faila iekļaušana HTML failā

Man ir 2 HTML faili, pieņemsim a.html un b.html. Es vēlos a.html failā iekļaut b.html.

JSF es to varu izdarīt šādi:

<ui:include src="b.xhtml" />

Tas nozīmē, ka a.xhtml faila iekšpusē es varu iekļaut b.xhtml.

Kā to var izdarīt *.html failā?

Risinājums

Manuprāt, labākais risinājums ir jQuery:

a.html:



    <script src="jquery.js"></script> 
    <script> 
    $(function(){
      $("#includedContent").load("b.html"); 
    });
    </script> 



     <div id="includedContent"></div>

b.html:

<p>This is my include file</p>

Šī metode ir vienkāršs un tīrs manas problēmas risinājums.

JQuery .load() dokumentācija ir šeit.

Komentāri (20)

Mans risinājums ir līdzīgs iepriekš minētajam lolo. Tomēr es ievietoju HTML kodu, izmantojot JavaScript's document.write, nevis jQuery:

a.html:



  <h1>Put your HTML content before insertion of b.js.</h1>
      ...

  <script src="b.js"></script>

      ...

  <p>And whatever content you want afterwards.</p>

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>\
\
');

Iemesls, kāpēc es neizmantoju jQuery, ir tāds, ka jQuery.js ir ~ 90 kb liels, un es vēlos, lai ielādējamo datu apjoms būtu pēc iespējas mazāks.

Lai bez liela darba iegūtu pareizi escapētu JavaScript failu, varat izmantot šādu sed komandu:

sed 's/\\/\\\\/g;s/^.*$/&\\/g;s/'\''/\\'\''/g' b.html > escapedB.html

Vai arī vienkārši izmantojiet šādu ērtu bash skriptu, kas publicēts kā Gist Github, kas automatizē visu nepieciešamo darbu, pārvēršot b.html par b.js: https://gist.github.com/Tafkadasoh/334881e18cbb7fc2a5c033bfa03f6ee6.

Pateicība Greg Minshall par uzlaboto sed komandu, kas izvairoties arī no aizmugurējām slīpsvītrām un vienpēdējām pēdiņām, ko mana sākotnējā sed komanda neņēma vērā.

Alternatīvi pārlūkprogrammās, kas atbalsta template literals, darbojas arī sekojošais:

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>

`);
Komentāri (10)

Kā alternatīvu, ja jums ir piekļuve servera .htaccess failam, varat pievienot vienkāršu direktīvu, kas ļaus interpretēt php failus, kas beidzas ar paplašinājumu .html.

RemoveHandler .html
AddType application/x-httpd-php .php .html

Tagad jūs varat izmantot vienkāršu php skriptu, lai iekļautu citus failus, piemēram:

<?php include('b.html'); ?>
Komentāri (5)