Html как загрузить код из другого файла

Импортировать HTML код из другого файла в код

Вам придется сделать запрос по url и результат запроса вставить в html.

var xhr= new XMLHttpRequest(); xhr.open('GET', 'x.html', true); xhr.onreadystatechange= function() < if (this.readyState!==4) return; if (this.status!==200) return; // or whatever error handling you want document.getElementById('y').innerHTML= this.responseText; >; xhr.send(); 

$(function() < $('#loadContent').load('page1.html'); >); 

Отслеживать
ответ дан 16 ноя 2017 в 12:19
1,907 13 13 серебряных знаков 22 22 бронзовых знака

• javascript
• html

Важное на Мете

Похожие

Подписаться на ленту

Лента вопроса

Для подписки на ленту скопируйте и вставьте эту ссылку в вашу программу для чтения RSS.

Дизайн сайта / логотип © 2023 Stack Exchange Inc; пользовательские материалы лицензированы в соответствии с CC BY-SA . rev 2023.10.27.43697

Нажимая «Принять все файлы cookie» вы соглашаетесь, что Stack Exchange может хранить файлы cookie на вашем устройстве и раскрывать информацию в соответствии с нашей Политикой в отношении файлов cookie.

Как вставить в div код с другого файла HTML?

Как вставить в текущую html-страницу содержимое другого html-файла?
Как вставить в текущую html-страницу содержимое другого html-файла? Допустим есть файл.

Вставить HTML-код с другого сервера на страницу
Таким же образом, как на страницу вставляются банеры с банер-ротаторов и щётчики Мне нужно.

Как вставить div в PHP код (в echo) — исправить код
Народ как вставить div в php код точнее в echo В этот код:<?php //отсеивание $dir = "MP3.

Вписать код html страницы в
Доброго времени суток 🙂 Т.к. я профан в JS, а скорей новичок 🙂 У меня на сайте есть папка там.

супермизантроп

3940 / 2978 / 692
Регистрация: 18.04.2012
Сообщений: 8,625

1. запись «имя функции + скобки» осуществляет запуск функции.
Назначение функции следует прописывать без скобок, вот так:

windowInfo.onmousemove = hide;

2. HTML устроен так, что файл можно загружать только в окно, коим может быть только:
— непосредственно окно браузера;
— фрейм;
— ифрейм.

3. в случае, если вам надо загрузить файл внутрь какого-то тега, то эту задачу надо решать так:
— загрузить файл в невидимый ифрейм;
— по окончании загрузки файла в ифрейм запомнить в переменной свойство innerHTML тега этого файла;
— присвоить свойству innerHTML нужного тега эту переменную.

89 / 89 / 19
Регистрация: 11.08.2011
Сообщений: 674

kalabuni,
1,2. Сделал так, ошибок никаких и роботает нормально, и если есть предложение получше. Прошу в студию.

1 2 3 4 5 6 7

function windowInfo(file){ var blockInfo = document.getElementById("blockInfo"); var windowInfo = document.getElementById("windowInfo"); windowInfo.innerHTML = "+ file +"' style='border: none; width: 100%; height: 100%;'>"; blockInfo.style.display = "block"; windowInfo.onmousemove = function(){blockInfo.onclick = function(){blockInfo.style.display = "none";};}; }

Подскажите, а как с фрейма передать данные в основное окно?

Мне надо чтобы выполнился следующий код:

meta http-equiv='refresh' content='0;url=/index.php'>

Добавлено через 6 часов 48 минут
Еще вопрос. Как передать переменную?

1 2 3 4 5 6 7 8 9 10 11 12

function mainMenuInfo(){ var mainMenu = document.getElementById("main_menu"); var menuLink = mainMenu.getElementsByTagName("img"); for(i = 0; i  menuLink.length; i++){ menuLink.item(i).onmousemove = function(){ alert(menuLink.item(element).getAttribute("alt")); // Переменная element должна быть равна переменной i которая используется тут menuLink.item(i). for(i = 0, newWidth = 64; i  menuLink.length; i++, newWidth -= 8){ } }; } }

Добавлено через 4 минуты
Пробовал вот так, но возвращает только 0, тоесть element содержит 0 всегда, на чтобы не наводил:

1 2 3 4 5 6 7 8 9 10 11 12

function mainMenuInfo(){ var mainMenu = document.getElementById("main_menu"); var menuLink = mainMenu.getElementsByTagName("img"); for(i = 0, element = 0; i  menuLink.length; i++, element++){ menuLink.item(i).onmousemove = function(element){ alert(menuLink.item(element).getAttribute("alt")); for(i = 0, newWidth = 64; i  menuLink.length; i++, newWidth -= 8){ } }; } }

Заполнение div блока из файла html

доброго времени суток. имеется два DIV блока (A и B). в блоке А ссылки (не кнопки). как заставить при клике на ссылку из DIV блока А загрузить информацию в DIV блок B из заранее подготовленного файла .html не перезагружая при этом всю страницу? iframe не подходит так как объемы могут быть разными.

это пример с iframe который мне не подходит .

1 2 3 4 5 6 7 8 9 10 11 12

//DIV блок A a href="#" onclick="changediv('1.html');return false;>ссылка 1a> a href="#" onclick="changediv('2.html');return false;>ссылка 2a> //DIV блок B div id="B">div> script type="text/javascript"> function changediv(id) {document.getElementById('B').innerHTML = ' noresize';}

94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
Ответы с готовыми решениями:

Залипание блока div в html далее содержимого блока
Подскажите пожалуйста, несколько дней не могу найти. Нужно div прилепить к верху после прокрутки.

Открытие блока в index.html из другого .html файла
Каким образом я могу открыть одну структуру кода html файла, в другом? Есть два файла index.html и.

Заполнение блока из файла
У меня есть блок див. Так же у меня есть файл ворд на котором написана информация и пару картинок.

Размещение нескольких блоков div внутри другого блока div
Хочу сделать шапку веб-страницы. Прикреплю ниже небольшую схему того, как она будет выглядеть. Хочу.

347 / 322 / 203
Регистрация: 27.06.2014
Сообщений: 762

Ну в качестве варианта вот так можно.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19

function includeFile (out) { var btns = document.querySelectorAll ("[data-file]"), res = document.querySelector (out), include = function (name) { var xhr = new XMLHttpRequest (); xhr.open ("GET", name); xhr.onreadystatechange = function () { if (xhr.readyState === 4 && xhr.status === 200) res.innerHTML = xhr.responseText; } xhr.send (); }, f = function () { include (this.dataset["file"]); }; [].forEach.call (btns, function (e) { e.addEventListener ("click", f); }); } window.addEventListener ("load", function () { includeFile ("#result"); });

1 2 3 4 5 6 7 8

div> загрузить файл 1

DOCTYPE html> html lang="ru"> head> meta charset="UTF-8"> meta name="viewport" content="width=device-width, initial-scale=1.0"> title>Документtitle> head> body> body> html>

var inBody = function()< // Создаём анонимную функцию. Помещаем её в переменную "inBody" var xhr = new XMLHttpRequest() // Создаём локальную переменную XHR, которая будет объектом XMLHttpRequest xhr.open('GET', 'text.html') // Задаём метод запроса и URL запроса xhr.onload = function()< // Используем обработчик событий onload, чтобы поймать ответ сервера XMLHttpRequest console.log(xhr.response) // Выводим в консоль содержимое ответа сервера. Это строка! document.body.innerHTML = xhr.response // Содержимое ответа, помещаем внутрь элемент "body" > xhr.send() // Инициирует запрос. Посылаем запрос на сервер. > inBody() // Запускаем выполнение функции получения содержимого файла