Συμπεριλάβετε ένα άλλο αρχείο HTML σε ένα αρχείο HTML

Έχω 2 αρχεία HTML, ας υποθέσουμε τα a.html και b.html. Στο a.html θέλω να συμπεριλάβω το b.html.

Στο JSF μπορώ να το κάνω έτσι:

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

Αυτό σημαίνει ότι μέσα στο αρχείο a.xhtml, μπορώ να συμπεριλάβω το αρχείο b.xhtml.

Πώς μπορούμε να το κάνουμε αυτό στο αρχείο *.html;

BalusC
Επεξεργασμένη ερώτηση Κάνε Ιανουάριος 2012 в 2:59
Προγραμματισμός
html include
Κάνε Ιανουάριος 2012 в 2:51
19 προβολές
Λύση

Κατά τη γνώμη μου, η καλύτερη λύση χρησιμοποιεί την 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>

Αυτή η μέθοδος είναι μια απλή και καθαρή λύση στο πρόβλημά μου.

Η τεκμηρίωση της jQuery .load() είναι εδώ.

SharpC
Επεξεργασμένη απάντηση Κάνε Νοέμβριος 2016 в 11:03
Σχόλια (20)

Η δική μου λύση είναι παρόμοια με αυτή του lolo παραπάνω. Ωστόσο, εισάγω τον κώδικα HTML μέσω της JavaScript's document.write αντί της χρήσης της 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>\
\
');

Ο λόγος για μένα ενάντια στη χρήση του jQuery είναι ότι το jQuery.js έχει μέγεθος ~90kb, και θέλω να κρατήσω την ποσότητα των δεδομένων που πρέπει να φορτώσω όσο το δυνατόν μικρότερη.

Προκειμένου να λάβετε το αρχείο JavaScript με σωστή διαφυγή χωρίς πολλή δουλειά, μπορείτε να χρησιμοποιήσετε την ακόλουθη εντολή sed:

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

Ή απλά χρησιμοποιήστε το παρακάτω εύχρηστο σενάριο bash που δημοσιεύτηκε ως Gist στο Github, το οποίο αυτοματοποιεί όλη την απαραίτητη εργασία, μετατρέποντας το b.html σε b.js: https://gist.github.com/Tafkadasoh/334881e18cbb7fc2a5c033bfa03f6ee6

Τα εύσημα στον Greg Minshall για τη βελτιωμένη εντολή sed, η οποία διαφεύγει επίσης από τις πίσω κάθετες και τα απλά εισαγωγικά, τα οποία η αρχική μου εντολή sed δεν έλαβε υπόψη της.

Εναλλακτικά, για προγράμματα περιήγησης που υποστηρίζουν template literals λειτουργεί και το ακόλουθο:

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>

`);
Chris Magnuson
Επεξεργασμένη απάντηση Κάνε Οκτώβριος 2019 в 3:24
Σχόλια (10)

Εναλλακτικά, αν έχετε πρόσβαση στο αρχείο .htaccess του διακομιστή σας, μπορείτε να προσθέσετε μια απλή οδηγία που θα επιτρέπει την ερμηνεία της php σε αρχεία με κατάληξη .html.

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

Τώρα μπορείτε να χρησιμοποιήσετε ένα απλό σενάριο php για να συμπεριλάβετε άλλα αρχεία όπως:

<?php include('b.html'); ?>
Σχόλια (5)