Создать полный HTML-файл, используя частичный HTML

Question

Создать полный HTML-файл, используя частичный HTML

0

У меня есть главная html-страница (index.html), и мне нужно построить эту страницу, динамически комбинируя несколько html файлов (custom_header_page.html/custom_content_page.html/custom_footer_page.html).

Я ищу способ сделать это без каких-либо скриптов на стороне сервера.

Например:

custom_header_page.html

custom_body_page.html

custom_footer_page.html

Просто устал со следующим в файле index.html и да, он загружается правильно, но я хочу переопределить содержимое <head> </head> моего index.html с тем, что я добавил в файле "custom_header.html".

index.html

<html>
<head>
    <script src="/jquery.min.js" type="text/javascript"> </script>
    <title>Title</title>
</head>
<body>

    <div id="custom_header"></div>

    <div id="custom_body"></div>

    <div id="custom_footer"></div>

    <script> 
        $(function(){
          $("#custom_header").load("custom_header_page.html"); 
          $("#custom_body").load("custom_body_page.html"); 
          $("#custom_footer").load("custom_footer_page.html"); 
        });
    </script>

</body>

JibW 14 апр. 2014, в 14:20

Источник

0

Почему ты так хочешь?
chris97ong 14 апр. 2014, в 11:59
0

Сервер загружает индексный файл динамически в соответствии с частичной HTML-информацией, которую мы предоставляем. Это делается для локальной настройки в папке, чтобы имитировать процесс проверки проекта перед его отправкой. Да, мы можем проверить это локально, редактируя в браузере, используя инструменты веб-разработчика, но идея состоит в том, чтобы сделать это позже кем-то, кто не знаком с HTML и этим. Измените CSS-элементы с помощью различных изображений верхнего и нижнего колонтитула и т. Д.
JibW 14 апр. 2014, в 12:06
1

То, как вы делаете это сейчас, создаст недействительный HTML. Ваша страница будет иметь дополнительные теги html и body . Также не рекомендуется делать это для SEO.
putvande 14 апр. 2014, в 12:21
1

Почему бы не использовать php? <?php echo $header; ?> кажется намного лучше, чем использование jquery, когда даже если вы не используете php, вы можете использовать vanilla js и сэкономить некоторое время загрузки. Я не уверен, что понимаю вашу общую логику здесь
EasyBB 14 апр. 2014, в 12:23
0

@putvande вы правы, если он не меняет селектор для загрузки. Т.е. load ('url.com #idOrClassOfElement'); и да, поисковая система не увидит эти html-файлы, она увидит только пустой документ, который вы должны знать, что поисковые машины действительно видят при сканировании
EasyBB 14 апр. 2014, в 12:24

Показать ещё 3 комментария

Теги:

javascript

jquery

html

dhtml

1 ответ

Ещё вопросы

Сервер загружает индексный файл динамически в соответствии с частичной HTML-информацией, которую мы предоставляем. Это делается для локальной настройки в папке, чтобы имитировать процесс проверки проекта перед его отправкой. Да, мы можем проверить это локально, редактируя в браузере, используя инструменты веб-разработчика, но идея состоит в том, чтобы сделать это позже кем-то, кто не знаком с HTML и этим. Измените CSS-элементы с помощью различных изображений верхнего и нижнего колонтитула и т. Д.
То, как вы делаете это сейчас, создаст недействительный HTML. Ваша страница будет иметь дополнительные теги html и body . Также не рекомендуется делать это для SEO.
Почему бы не использовать php? <?php echo $header; ?> кажется намного лучше, чем использование jquery, когда даже если вы не используете php, вы можете использовать vanilla js и сэкономить некоторое время загрузки. Я не уверен, что понимаю вашу общую логику здесь
@putvande вы правы, если он не меняет селектор для загрузки. Т.е. load ('url.com #idOrClassOfElement'); и да, поисковая система не увидит эти html-файлы, она увидит только пустой документ, который вы должны знать, что поисковые машины действительно видят при сканировании

jbyrne2007 · Answer 1 · 2014-04-14T10-45-00.000Z

-2

Вы не можете редактировать файлы без использования серверной части, такой как php, вы можете редактировать заголовки html с помощью jquery, но это будет только в локальном браузере, это не изменится для всех остальных.

jbyrne2007 14 апр. 2014, в 10:45

0

Почему это работает только в локальном браузере, а не для всех остальных? Если «все остальные» пойдут на сайт ОП, не будут ли они все использовать «локальный браузер»?
putvande 14 апр. 2014, в 12:25
0

HTML, CSS, jquery являются языками на стороне клиента. Если вы создали страницу с div и полем ввода, а все, что вы поместили в поле ввода, назначило его обновленному div, то его там не будет. Это не появится ни для кого еще.
jbyrne2007 14 апр. 2014, в 13:04
0

OP использует только load для загрузки другой HTML-страницы. Это будет работать для всех, и все видят одно и то же.
putvande 14 апр. 2014, в 13:46
0

. $ ( "Голова") нагрузка ( "custom_header_page.html");
jbyrne2007 14 апр. 2014, в 14:15
0

Да, я думаю, что Jbyrne запутался в том, что спрашивает ОП. Он не вводит входные данные. У него есть три разных HTML-файла, каждый из которых является статическим. И на другой странице загрузка этих статических страниц с помощью ajax создает динамическую страницу. Хотя по сути это совсем не лучшая идея, и лучше использовать php. Все увидят это.
EasyBB 15 апр. 2014, в 12:22

Показать ещё 3 комментария