загрузка нового html-файла

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

<html>
<head>
    <link rel="stylesheet" href="tabs.css">
<body>
    
</body>
</head>
</html>
0
nl ja de
@ user1878200 ответ на ваш вопрос jqueryui.com/tabs/#ajax
добавлено автор Deeptechtons, источник
Если вы хотите использовать javascript/jQuery, я советую вам это api.jquery.com/load
добавлено автор Ron van der Heijden, источник

3 ответы

Вы можете загрузить контент из другого HTML-файла с помощью метода jQuery '.load ().

Шаг 1 - Включите jQuery в свой код.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

Step 2 - Add this code before the closing </body> tag.

<script>
    $(document).ready(function() {
        $('#tab1').load('html-file-1.html');    
    });
</script>

Step 3 - Your external html file html-file-1.html contains nothing but simple html tags to represent the content you want to load within the section.

0
добавлено

Option 1
Use iframes to archive this. It will display another page.

Option 2
Use Ajax Example

0
добавлено
Всегда пожалуйста. :)
добавлено автор New Developer, источник
Большое вам спасибо, используя iframes.
добавлено автор user1878200, источник

HTML - это структура , CSS - стиль (внешний вид), а JavaScript - поведение . Вы не можете загружать данные только с одной структурой, вам нужно будет ввести некоторые скрипты. jQuery - это общая библиотека, которую довольно легко изучить, но есть много доступных.

0
добавлено
Верстка сайтов HTML/CSS/JS/PHP
Верстка сайтов HTML/CSS/JS/PHP
3 439 участник(ов)

Правила группы: напишите !rules в чате. Группа Вк: vk.com/web_structure Freelancer: @web_fl Веб Дизайн: @dev_design Маркетолог: @topmarkening Автор: @M_Boroda

Чат — Типичный Верстальщик
Чат — Типичный Верстальщик
1 080 участник(ов)

Основной канал: @tpverstak Обратная связь: @annblok Все ссылки на соц.сети проекта: http://taplink.cc/tpverstak ПРАВИЛА ЧАТА — https://teletype.in/@annblok/BygPgC3E7

Веб-Технологи: UI/UX, Вёрстка, Фронтенд
Веб-Технологи: UI/UX, Вёрстка, Фронтенд
167 участник(ов)

Всё про веб-дизайн и вёрстку. А также: HTML, CSS, флекс и бутстрапы, шаблонизаторы, препроцессоры, методологии, аглифаеры, улучшаторы и обфускаторы. Обсуждаем темы юзабилити, устраиваем А/В тесты лендингов, и проводим аудит.

DTP :: @DTPublish
DTP :: @DTPublish
147 участник(ов)

Обсуждаемые темы: полиграфия, препресс, верстка, дизайн, иллюстрации, скрипты, плагины. Канал - @DTPublishing