DWWEB.RU
СКРИПТЫ

Инклуд в явасскрипт

Давно мы хотели написать об инклуде в явасскрипт, но все никак руки не доходили. И тут увидел совершенно огроменный код, что кроме плевков ничего у меня не вызвало!

Нам нужен простой! Короткий код, который мы в состоянии понять! Поскольку мы, еще не разбираемся в javascript также как и в php , то приходится всё делать по-наитию!

Сразу надо начать с моего огромного удивления, почему не сделали простой до банальности функцию, как в php "include" - мне не понятно! Но как говорится у программистов своя логика... И да, если вы не в курсе, то include в javascript не существует! Есть заменители и вот о них-то мы сегодня и погорим!

.

Вариант №1 include в javascript

Итак первый вариант, он может использоваться при трансляции кода с другого сайта, к примеру как вот этот:

а)

Данный код вставляем на страницу. где нужно вывести соответствующий код с другой страницы.

<script type="text/javascript" src="http://marrex.ru/a-data/SEND/send_reklama_500_na_120.html"></script>

б)

Это второй кусок кода, который должен находиться на второй странице с которой будет транслироваться код на первую страницу.

Если вы перейдете на страницу то нажав сочетание клавиш ctrl + U, увидите следующий код:
document.write('<a href=Эту картинку, скриншот, можно увеличить в отдельном окне нажмите по нему!http://marrex.ru/Raznoe/5_macbook-pro-2017.html target=_blank><img src=Эту картинку, скриншот, можно увеличить в отдельном окне нажмите по нему!http://marrex.ru/a-data/SEND/send_reklama_500_na_120.png width=500 height=120 alt=macbook_pro_2017></a>');

Смотрим результат работы скрипта замены инклуд:

Недостатки первого варианта.

Если вам требуется вывести большой код, то скопировать полстраницы и вставить вовнутрь не получится - произойдет ошибка, потому, что каждый перенос нужно оформлять соответствующим способом... например возьмем верхний код и покажем, как это следует сделать:

document.write('<a href=http://marrex.ru/Raznoe/5_macbook-pro-2017.html'

+'target=_blank><img src=http://marrex.ru/a-data/SEND/send_reklama_500_na_120.png'

+' width=500 height=120 alt=macbook_pro_2017></a>');

Вариант №2 include в javascript.

Если нет подключенных библиотек. то между тегами Вставляем данный код.
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>

В тегах "div" с "ид" равным "content" передается информация с вашей другой страницы.

Можно использовать относительный путь, если файл находится в этой же папке, то можно использовать лишь название файла.

Далее в том месте, где мы хотим внести инклуд через javascript вписываем такую строчку.

<div id="content"></div><script type="text/javascript"> $(function () { $('#content').load('https://dwweb.ru/__a-data/_primer/js/include/different/javascript_include_primer.html'); });</script>

И для иллюстрации функции include в явасскрипт смотрим вывод информации из двух файлов:

Из HTML файла:
Из TXT файла: Хотел показать результат неправильной кодировки, которая переодически встречается при работе с txt файлами...

И да! Совсем забыл, если вы используете данную функцию более одного раза на странице, то нужно изменить ид например на такой - id="content_2" + в самой функции надо заменить "#content" на "content_2"

Из TXT файла С правильной кодировкой:

Аналог include в явасскрипт

Конечно – это не совсем то, что есть у нас в php и довольно громоздкая конструкция получается! И мы подумали, что будет интересно найти и показать какие-то дополнительные вариации инклуда в яваскриптах…

Вариант №3 include в javascript.

Интересный вариант нашел на просторах интернета...и немного модифицировали его функцию занесли прямо в скрипт, чтобы он здесь на странице на болтался…

Подключаем скрипт:

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

Создаем два новых блока, в которых и подключаем наши страницы…

new include('block1','demo.txt'); 
new include('block2','demo.html'); 

И собственно следующим шагом выводим результат инклюда на страницу!

<div id="block1"></div> 
<div id="block2"></div> 
Результат см.здесь

Не забудь !
Оставить комментарийCOMMENTS+
Сообщений пока нет - Вы можете стать первым
BBcode
нажмите, чтобы загрузить аватар
Загрузить свой аватар(max ширина, высота = 100px) ( как это работает)

Закрыть
+ =
Подписаться
Теги:
инклуд в явасскриптinclude в javascriptаналог include в явасскриптаналог инклуд в javascript

НАШИ ПРОЕКТЫ : Проекты находятся в разной степени готовности (просто их столько, что времени не хватает…) Все статьи авторские, при копироавании активная ссылка обязательна DwWeb.ru! © 2015 - 2019