|
Внедрение фрагмента Html
Этим зимним вечером, я, наивный чукотский мальчик, сидел и думал: "А как же мне написать кусок HTML в отдельный файл и внедрять его потом куда вздумается?". И почему это с самого начала не предусмотрено?
Можно ли используя только JScript вставлять вот так кусок таблицы и как бы это сделать попрактичнее без document.write в каждой строке? P.S. То что было в середине декабря я уже читал. |
<!--#include virtual="document.html" -->
Добавлено через 7 минут: Цитата:
|
Цитата:
|
Bespalov Roman
почитай про SSI |
А если SSI не поддерживается, кто-то придумал что-нибудь приличное?
|
Bespalov Roman
PHP 8) Или пишешь на JavaScript функцию, выводящую таблицу, выносишь ее в отдельный файл, потом на всех страницах подключаешь этот файл и вызываешь ее в нужном месте. |
Bespalov Roman :Я думаю, можно загрузить файл с фрагментами в невидимый фрейм, а оттдуа успользуя JS вставлять их куда нреобходимо по документу.
Про невидимый фрейм можно глянуть здесь: http://www.imho.ws/showthread.php?s=&threadid=45815 Вставлять фрагменты html можно, наверна так: <div id="my"> </div> document.all.my.outerHTML="строка с html кодом" |
Я уже отладил загрузку через функцию, мне удалось грузить несколько строк HTML в текстовую переменную без особого ущерба для кода. Потом я их вставляю через document.write();. Это я делаю с несколькими столбцами таблицы, которые повторяются на каждой странице сайта.
Попробую еще через невидимый фрейм... А как его зацепить-то из фрейма? Через document.all.ifr.outerHTML вставляется вместе с фреймом... |
Bespalov Roman :На невидимым фреймом поработать интереснее, т.к. в него можно помещать что угодно, а в предыдущем варианте, приходится писать в подгружаемом файле что-то типа var mytext="...". Если получится с фреймом, расскажи подробнее, мне это тоже интересно.
|
А блин, ты еще сам не пробовал (см. предыдущее сообщение)!?!
Ну ладно, до завтра, сегодня уже нет желания ломать голову. |
Bespalov Roman
Вот пример, если еще надо. Я тут глянул, не намного удобнее чам при помощи подключаемого JS, кроме того OuterHTML вроде не всеми браузерами поддерживается... --------- main.htm --------- <html> <iframe src="1.htm" name="myframe"> </iframe> <body> <div id="mydiv"> </div> <script> document.all.mydiv.innerHTML=parent.myframe.document.all["b1"].outerHTML; </body> </html> --------- 1.htm --------- <h1 id="b2">Заголовок</h1> <button id=b1>Кнопка</button> --------- |
Это работает? А то я пробовал ID вставить в <iframe ...> - печатался весь фрейм.
И конечно меня интересует гораздо больше строк html. В случае со скриптом в конце каждой строки html приходится вставлять \, для того чтобы их переносить, иначе переменной просто ничего не присвоится. Поэтому там с html приходится чудить конкретно. Я так понимаю, что кусок html нужно заключить в <span ID="..."> ... </span>, а потом вставлять все целиком. И вопрос второй - outerHTML действительно не поддерживается NN, может еще что-то можно придумать? Например если взять getElementById(), то его наверное можно потом напечатать? |
Насколько я помню innerHTML и outerHTML не являются DOM стандартом, а значит поддерживаются только IE.
|
Bespalov Roman
Цитата:
Цитата:
Цитата:
document.getElementById("myframe") Добавлено через 1 минуту: RaZEr InnerHtml вроде поддерживается еще NN6, а outerHTML кроме IE ничем. Добавлено через 1 минуту: RaZEr :Кстати, я и о являются DOM стандарте в первый раз слышу :) |
CEO
Ты точно это проверял? У меня parent.myframe.document.all["b1"].outerHTML - null или не является объектом. |
Цитата:
|
Цитата:
Хотя у меня работало, странно. Ну если разберешься и мне расскажи, т.к. интересно. Кстати, то что я написал -- отредактированный вариант, только что прверил -- действительно не работает. Но когда я отлаживал было так: <html> <iframe src="1.htm" name="myframe"> </iframe> <body> <div id="mydiv"> </div> <script> msg="" for (i=0; i<document.all.length; i++) { msg+=i+" "+document.getElementById("myframe").all[i]+"\n" } alert(msg) alert(parent.myframe.document.all[0].outerHTML) document.all.mydiv.innerHTML=parent.myframe.document.all["b1"].outerHTML; </script> </body> </html> Татк все точно работает, а когда убираю alert(msg) alert(parent.myframe.document.all[0].outerHTML) -- перестает работать. Почему бы это? Все, кажись разобрался, хотя и без всякого понятия почему так:: <html> <iframe src="1.htm" name="myframe"> </iframe> <body> <div id="mydiv"> </div> <script> function window.onload() { document.all.mydiv.innerHTML=parent.myframe.document.all["b1"].outerHTML; } </script> </body> </html> Так только что проверил -- работает. |
Короче это штука реальная, только делается она через узлы (Nodes), тогда все поддерживается W3C DOM. Принцип следующий: сканируется структура узлов (тегов) в источнике, причем совершенно не обязательно имеющих id, потом создается такая же структура в получателе и передается содержимое тегов.
Это нужная вещь и я не понимаю, почему она до сих пор не реализована для всех броузеров. Можно было бы outerHTML поддержать и тогда бы не пришлось городить огород. У меня, например, в каждом разделе сайта есть на страницах подменю, в нем ссылки на все страницы раздела. Когда они добавляются, то приходится править и перезакачивать все страницы раздела, вместо того, чтобы поправить только меню. А еще на всех страницах есть меню разделов, которое случилась необходимость поправить, а страниц несколько десятков, не знаю даже сколько. Короче, вот недоделанный скрипт, в котором пока не реализован принцип, о котором я сказал выше: <script> function window.onload() { var i=3 while (parent.myframe.document.all[i]!=null) { var oldItem = parent.myframe.document.all[i]; var newItem = document.createElement(oldItem.tagName) if (oldItem.lastChild.nodeValue!=null) { newItem.appendChild(document.createTextNode(oldItem.lastChild.nodeValu e)) } else { newItem.appendChild(document.createTextNode("")) } var lastChild = document.getElementById("mydiv[i]") document.getElementById("mydiv").appendChild(newItem, lastChild) i++ } } </script> У кого будут мысли - пишите. |
Честно говоря я уже заколебался решать эту задачу через W3C DOM. Не понимаю, почему скрипт:
<html> <body> <div id="mytag"><a href="2.htm">Ссылка</a></div> <div id="mynod"><div id="mydiv"></div></div> <script> var oldItem = document.all["mytag"]; var newItem = document.all["mydiv"]; newItem=oldItem.cloneNode(true); document.all["mynod"].appendChild(newItem); </script> </body> </html> запросто выполняется. А другой скрипт: <html> <body> <iframe src="3.htm" name="myframe"></iframe> <div id="mynod"><div id="mydiv"></div></div> <script> function window.onload() { var oldItem = window.myframe.document.all["mytag"]; var newItem = document.all["mydiv"]; newItem=oldItem.cloneNode(true); // document.all["mynod"].appendChild(newItem); } </script> </body> </html> -------- 3.htm -------- <div id="mytag"><p><a href="2.htm">Ссылка</a></p></div> -------- не выполняется без события window.onload(), а потом спотыкается на закавыченной строке. Может у кого-то версия с фреймом заработает? Про другой, более сложный путь я уже и не говорю. Там мне удается воссоздать полностью все дерево тегов, но они получаются без аттрибутов, а скопировать их не представляется возможным за отсутствием приличных методов. Чем думали разработчики W3C DOM я не могу понять? |
Bespalov Roman
ты все это пытаешься сделать только ради того, чтобы меню вставлять на всех страницах из одного файла? PS: а без события onload не работает потому, что iframe не успевает загружаться. |
Saruman
Цитата:
Цитата:
|
Bespalov Roman
А смысл в таких мрачных извращениях вообще? Как я понимаю, меню у тебя будет статическое. Почему бы его не генерить простым набором document.write, которые будут лежать в одном файле, включающемся на всех страницах? Или я что-то не так понимаю? |
Saruman
Для горизонтального меню я уже так сделал. Но там, чтобы создать текстовую переменную, приходится после каждой строки ставить "\" и строк там бывает довольно много. У меня еще есть вертикальная менюшка и я решил делать "извращения". Они совсем не были бы такими мрачными - скриптик-то совсем набольшой, но написание скриптов на JavaScript чаще всего приносит только одну головную боль. Я еще написал одному товарищу, который распинался на счет W3C DOM, узлов и соответствующих методах. Если из всего этого ничего путного не выйдет, то придется остановиться на том способе решения. |
Bespalov Roman
А что, хостинг ни ssi, ни php не дает? Или принципиально не хочешь использовать? |
Ладно, я уже все переделал на document.write(..., весь день провозился. Больше революций не будет.
|
Меня эта тема тоже очень, волновала, все не мог придумать как и что делать вот совсем недавно наткнулся на вот такое решение: http://exper.ural.ru/0051.phtml
может кому пригодиться имхо полезная вещь. |
Я сначала как правильный юзер пытался использовать W3C DOM, но золотое правило говорит: "чем проще - тем надежнее"!
Теперь я делаю скажем менюшку в отдельном файле html и проверяю ее на работоспособность, а потом, с помощью бесхитростной утилитки, из этого html делается файл с document.write(...). Естественно, этот JScript вставляется в нужный файл с помощью известного тега <script>. Это будет работать на всех браузерах пока жив Интернет. |
Цитата:
|
Но если используешь бесплатный хостинг, это будет явно дороже :) ...
|
Да и на бесплатных дают и SSI и PHP.
|
Bespalov Roman, Izzyy :
Тема изначально была интересна только теоретически, "что можно сделать средствами JS?" А на практике самое простое решение это коечно же SSI. RaZEr Цитата:
Бесплатный без CGI, но с SSI, с хорошой скоростью -- by.ru. |
| Часовой пояс GMT +4, время: 10:53. |
Powered by vBulletin® Version 3.8.5
Copyright ©2000 - 2025, Jelsoft Enterprises Ltd.