|
|
|
| Добрый день. Уважаемые форумчане назрел очередной вопрос:)
Подскажите пожалуйста как с помощью JS выгрузить html+css шаблон? и выгружался он каждую секунду, так что бы если в него были внесены изменения на сервере, изменения сразу же отображались в браузере...
Заранее благодарен! | |
|
|
|
|
|
|
|
для: TanTaL91
(14.09.2010 в 21:34)
| | Вы каждую секунду меняете CSS? | |
|
|
|
|
|
|
|
для: sim5
(14.09.2010 в 21:55)
| | Мне не для интернета, я когда верстаю нехочу отвекаться на обновление страницы браузера, проще запустить такую штуку на 2ром мониторе, и глядеть спокойной:)
Почему не простое обновление, сейчас у меня оно и стоит, но от него браузера как нервный дергается, маргает и постояно бросается по скролу то вверх то вниз. | |
|
|
|
|
|
|
|
для: TanTaL91
(14.09.2010 в 22:26)
| |
<html>
<head>
<link rel=stylesheet type='text/css' href=''>
</head>
<body onload='setcss()'>
<script language=JavaScript>
var i=0;
function setcss()
{
var style=document.getElementsByTagName('link')[0];
style.href='styles.css?'+i;
i++;
setTimeout('setcss()',1000);
}
</script>
================Тут ваш код===================
</body>
</html>
|
Если поставите скрипт себе на страницу, проследите, что-бы LINK с вашим CSS был первый в HEAD. | |
|
|
|
|
|
|
|
для: TanTaL91
(14.09.2010 в 22:26)
| | для firefox есть Reload Every http://reloadevery.mozdev.org/ | |
|
|
|
|
|
|
|
для: TanTaL91
(14.09.2010 в 21:34)
| | а в опере и качать ничего ненадо) правой кнопкой по странице) | |
|
|
|
|
|
|
|
для: sl1p
(15.09.2010 в 07:30)
| | Gubichev спасибо, попробу.
AlexSol Не люблю лису:)
sl1p правой кнопкой, и что дальше? "обновить?"))) | |
|
|
|
|
|
|
|
для: TanTaL91
(15.09.2010 в 08:03)
| | чуть ниже : обновлять каждые ... | |
|
|
|
|
|
|
|
для: AlexSol
(15.09.2010 в 08:15)
| | Это все хорошо, но ни чем не отличается от того что я могу вставить JS код в шапку, который будет его так же обновлять...
А вот как у меня сейас реализована подгрузка html:
index.php
<script language='JavaScript'>
function change()
{
if (window.XMLHttpRequest){xmlhttp=new XMLHttpRequest();}
else{xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");}
xmlhttp.onreadystatechange=function(){
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("body").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","ajax/refrash-handler-01.php",true);
xmlhttp.send();
}
var timerId=setInterval("change()", 100);
</script>
<div id="body"></div>
|
ajax/refrash-handler-01.php:
<?
$file_exchange_rate = file_get_contents("http://localhost/01/index.html");
echo $file_exchange_rate;
?>
|
Когда я вставлю решение уважаемого Gubichev
TanTaL91 (14.09.2010 в 22:26)
<html>
<head>
<link rel=stylesheet type='text/css' href=''>
</head>
<body>
<body onload='setcss()'>
<script language=JavaScript>
var i=0;
function setcss()
{
var style=document.getElementsByTagName('link')[0];
style.href='styles.css?'+i;
i++;
setTimeout('setcss()',1000);
}
</script>
================Тут ваш код===================
</body>
</html>
|
Экран сново начинает мерцать... буд то бы идет обновление. А как то иначе можно реализовать подгрузку css. Что бы он так же подгружался незаметно как и html.
В итоге у нас получится стоячая страница, которая будет изменяться синхроно с файлами из которых ее выгружают... | |
|
|
|
|
|
|
|
для: TanTaL91
(15.09.2010 в 08:30)
| | помоему наоборот удобнее каждый раз обновить) так ты морально готов к тому чтобы увидеть изменения) я бы всё равно клацал на обновить даже если бы страница делала это сама) | |
|
|
|
|
|
|
|
для: sl1p
(15.09.2010 в 08:37)
| | Это вы бы так делали, а я так не хочу делать, на это уходит время... Нужно отвлекаться на ненужную вещь... А так у меня в сосендем мониторе идут изменения, и идут, я только гляжу куда и что подвинуть, как праправить... Работа ускорится как минимум в 1.5 раза... | |
|
|
|
|
|
|
|
для: TanTaL91
(15.09.2010 в 08:43)
| | Рецепт:
1. Запомнить текущий body.innerHTML.
2. Запомнить текущий текст styleSheet.
3. Запомнить текущие body.scrollLeft и body.scrollTop.
4. Загрузить в невидимый ифрейм тот же URL c меняющимся query_string.
5. Сравнить body.innerHTML ифрейма с тем, что в памяти; сравнить текст styleSheet ифрейма с тем, что в памяти.
6. При наличии разницы в п. 5 обновить текущее окно с принудительной установкой скролла в предыдущие позиции.
7. Исполнять всё это (п. 1 - п. 6) каждые N секунд.
Примечание: наличие query_string для страницы внутри ифрейма отменяет действие этого скрипта.
|
| |
|
|
|
|
|
|
|
для: TanTaL91
(15.09.2010 в 08:43)
| | >Работа ускорится как минимум в 1.5 раза
Поставьте себе среду для разработки (IDE): komodo, PhpStorm - при изменении стилей - увиде сразу обновленный вариант во встроенном браузере. | |
|
|
|
|
|
|
|
для: TanTaL91
(15.09.2010 в 08:30)
| | Переписал код. По идее мерцать не должно.
P.S. У IE теоретически могут возникнуть проблемы с обновлением, т.к. он кеширует CSS. Но такая вероятность крайне мала.
P.P.S. Во время вёрстки лучше воздержаться от мета-тегов, линков и всего остального в HEAD.
<html>
<head>
<link rel=stylesheet type=text/css href='styles.css'>
</head>
<body>
<body onload='setcss()'>
<script language=JavaScript>
var x=0;
function setcss()
{
x=""+Math.random();
x=x.substring(2);
var link=document.createElement('link');
link.href='styles.css?sdd'+x;
link.rel='stylesheet';
link.type='text/css';
document.getElementsByTagName('head')[0].appendChild(link);
document.getElementsByTagName('head')[0].removeChild(document.getElementsByTagName('head')[0].childNodes[1]);
setTimeout('setcss()',1000);
}
</script>
=================ваш код===============
</body>
</html>
|
| |
|
|
|
|
|
|
|
для: TanTaL91
(14.09.2010 в 21:34)
| | [поправлено модератором] | |
|
|
|
|
|
|
|
для: mihdan
(15.09.2010 в 16:10)
| | Всем огромное спасибо за помощь. Особено хотелось выделить Gubichev последнее ваше решение в опере работает на ура, хоть и перезагруается страница, но работе это ни как не мешает...
Отлично, mihdan объязательно посмотрю то что вы посоветовали! Еще раз все спасибо! | |
|
|
|