подгрузить файл скрипта на событие
подскажите пож-та реально ли подгрузить файл скрипта на событие, т.е. например:
<input type="button" onclick="hello()"> <script> function hello() { <script src="blabla.js" type="text/javascript"></script>; } </script> т.е. понятно что такое работать не будет, а как сделать чтоб работало |
var s = document.createElement('script');
s.src = 'blabla.js';
document.body.appendChild(s);
|
Блин тут все гении сидят...
Я почувствовал себя младенцем :( |
Цитата:
|
в моем случае надувной матрас... но он растет :)
|
Цитата:
я правильно понял? <input type="button" onclick="loadscrcou();"> <script> function loadscrcou() { var loadscript = document.createElement('script'); loadscript.src = '../new/js/couscr/Spaot.js'; document.body.appendChild(loadscript); } </script> |
Вернее в мозилле не работает, а в ИЕ ок
|
var s = document.createElement('script');
s.type = 'text/javascript';
s.src = 'blabla.js';
document.body.appendChild(s);
А так? |
Цитата:
что интересно, пока страница грузится, нажимаешь на кнопку скрипт подгружается, когда загрузилась, нет... это только в мозилле |
Странно конечно
var s = document.createElement('script');
s.type = 'text/javascript';
s.src = 'blabla.js?' + Math.random();
document.body.appendChild(s);
|
подозреваю, что более кросбраузерно будет атачить к head-у
вот код из статьи
function attachScript(id, src){
var element = dojo.doc.createElement("script")
element.type = "text/javascript"
element.src = src
element.id = id
document.getElementsByTagName("head")[0].appendChild(element)
}
|
Цитата:
|
не грузит :(
и ИЕ через раз буду стучать бубном... |
Цитата:
|
я упо скопипастил код из статьи.
это часть фреймворка, и dojo.doc Это наврено обертка над document в лданном случае можно спокойно писать document.createElement("script") |
Цитата:
в идеале нужно чтоб работало на window.onload дело в том что изначально срабатывает php script который определяет isset или !isset переменная, и если определена выводит documen.onload, который в свою очередь подгружает файл скрипта работает:
<input type="button" onclick="loadscr1()">
<script>
function loadscr1() {
var scri = document.createElement('script');
scri.setAttribute('type', 'text/javascript');
scri.src = 'new/js/couscr/Script.js';
document.getElementsByTagName('head')[0].appendChild(scri);
}
</script>
не работает:
<script>
window.onload = function () {
loadscr1();
}
</script>
<script>
function loadscr1() {
var scri = document.createElement('script');
scri.setAttribute('type', 'text/javascript');
scri.src = 'new/js/couscr/Script.js';
document.getElementsByTagName('head')[0].appendChild(scri);
}
</script>
и через jquery пытался сделать не получилось.. так: <body onload="loadscr1()"> тоже не хотелось бы |
во втором варианте либо поменяй местами теги script, либо объедени их в один(тогда местами можно не менять)
рпоблема в том, что в момент, когда ты пытаешся повесить событие, функция loadscr1() еще не определена Ее надо либо определить в более раннем блоке script либо просто поместить в тот же блок(в таком случае она будет видна, даже если будет написана позже.но только если ее определять как ты написал)
<script>
function loadscr1() {
var scri = document.createElement('script');
scri.setAttribute('type', 'text/javascript');
scri.src = 'new/js/couscr/Script.js';
document.getElementsByTagName('head')[0].appendChild(scri);
}
window.onload = function () {
loadscr1();
}
</script>
|
пробовал поменять, ща еще попробую
|
первый вариант, предложенный Kolyaj, у меня работает:
window.onload = function() {
var s = document.createElement('script');
s.src = '1.js';
document.body.appendChild(s);
}
1.js: alert(2); проверял в ie 7, ff 3, opera 9. Либо у тебя более старые версии, либо специфический скрипт |
Цитата:
может попробовать таймаут выставить... секнду-две |
Цитата:
|
LamerNo1 в любом случае надо выяснить причину, т.е. постепенно сокращать скрипт, пока он не станет запускаться. Например, в конце скрипта можно вставить тот же alert. При это появление диалогового окна будет означать, что скрипт запустился
|
Так получилось сделать?
|
test.js
var AnyElem={
param1: 'val1',
param2: 2,
setParam: function(p,v){
if(this[p]&&v){
this[p]=(typeof this[p]==='string')?v.length>0?v:'':parseInt(v);
}
}
};
index.html
<html>
<head>
<script language="javascript">
function loadSrc(p){
if(p&&p.length>0){
var s=document.createElement('script');
with(s){
setAttribute('type', 'text/javascript');
setAttribute('language', 'javascript');
src=p;
}
// document.getElementsByTagName('head')[0].appendChild(s);
document.body.appendChild(s);
}
}
var init=function(){
loadSrc('test.js');
console.log(AnyElem);
}
</script>
</head>
<body onload="init()">
</body>
</html>
Лог консоли FF3 Цитата:
|
jquery, например, так не делает, она создает элемент, в который вставляет скрипт, а потом этот элемент вставляет в документ. Примерно так:
var script = document.createElement("script"),
id = "script" + (new Date).getTime();
script.type = "text/javascript";
try {
script.appendChild( document.createTextNode( "window." + id + "=1;" ) );
} catch(e){}
root.insertBefore( script, root.firstChild );
// Make sure that the execution of code works by injecting a script
// tag with appendChild/createTextNode
// (IE doesn't support this, fails, and uses .text instead)
if ( window[ id ] ) {
jQuery.support.scriptEval = true;
delete window[ id ];
}
root.removeChild( script );
// Evalulates a script in a global context
globalEval: function( data ) {
if ( data && /\S/.test(data) ) {
// Inspired by code by Andrea Giammarchi
// [url]http://webreflection.blogspot.com/2007/08/global-scope-evaluation-and-dom.html[/url]
var head = document.getElementsByTagName("head")[0] || document.documentElement,
script = document.createElement("script");
script.type = "text/javascript";
if ( jQuery.support.scriptEval )
script.appendChild( document.createTextNode( data ) );
else
script.text = data;
// Use insertBefore instead of appendChild to circumvent an IE6 bug.
// This arises when a base node is used (#2709).
head.insertBefore( script, head.firstChild );
head.removeChild( script );
}
},
p.s. по-моему ничего важного не пропустил |
. .
|
Общий принцип понятен, но по моему через чур заморочисто... Можно использовать по принципу "если нельзя, но очень хочется, то можно"... в самых крайних условиях.
ИМХО, легче до начала инициализации подгрузить все скрипты и спокойно работать... |
да уж, сообщение: "Подгружаются все скрипты, приходите завтра!" :)
p.s. я и не говорил, что нужно этим повсеместно пользоваться |
Я делал немного проще...
var head=document.documentElement.firstChild; // Есть и другие варианты получить head. Кому как удобнее.
// Подключаем скрип
var js=document.createElement('script');
js.type='text/javascript';
js.src='script.js';
head.appendChild(js);
//Подключаем стили (так... до кучи...)
var css=document.createElement('link');
css.href='style.css';
css.media='screen'; //all, print ect.
css.rel='stylesheet';
css.type='text/css';
head.appendChild(css);
Работает везде, где нада (не придерацца к мелочам!!). Проверить загрузился ли скрипт нужно вариантом с callback имхо. Более точно проверять можно при использовании аякс. Получили в xml, распарсили, вставили(как вариант). |
B~Vladi,
для общего развития. Попробуйте запустить ваш код в ИЕ6 в контексте такой вот страницы.
<html>
<head>
<base href="/" />
<script type="text/javascript">
var head=document.documentElement.firstChild; // Есть и другие варианты получить head. Кому как удобнее.
var js=document.createElement('script');
js.type='text/javascript';
js.src='script.js';
head.appendChild(js);
</script>
</head>
<body>
</body>
</html>
|
Цитата:
НЕЛЬЗЯ обращацца к элементам из хеда :). В твоём варианте мы можем не получить ссылку на хед, т.к. дом не собран. Зачем извращаться?! парню нада динамично(т.е. по событию) вставить скрипт и этот вариант РАБОТАЕТ в 6-ом ишаке;) |
Цитата:
Элементы всегда доступны сразу же, а не после того, как все загрузятся. |
Kolyaj, я бы не стал пользовацца такими методами... уж больно это ненадёжно... вставлять скриптом другой скрипт в хеде это пооолное извращение. Если необходимо по событию прикрутить скрипт/стиль - мой вариант вполне с этим справляется. Стабильно работает в ие6,7,8, опера,9.2, 9.6, 10, мозилла 2, 3, хром (проверено) - что забыл?! Сафари?! протести еси не лень плз.
Вот небольшая вырезка. Элемент BASE задает в обязательном атрибуте href базовый URI для данного документа, который используется обозревателем для приведения относительных URI к полным. Подробности см. в Приложении 2. Если документ не содержит элемента BASE, то его собственный URI считается базовым по умолчанию. В большинстве случаев этого вполне достаточно, поэтому на практике элемент BASE употребляется только в двух ситуациях: когда документ хранится в нескольких узлах Сети, и мы хотим указать "эталонное" хранилище; когда URI документа неизвестен (например, при его получении по электронной почте). Рассмотрим следующий пример: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/html4/strict.dtd"> <HTML> <HEAD> <TITLE>Наша продукция</TITLE> <BASE href="http://www.bestseller.com/products/intro.html"> </HEAD> <BODY> <P>Лучшие в мире <A href="images/hornhoof.gif">рога и копыта</A>! </BODY> </HTML> С учетом базового URI ссылка "../images/hornhoof.gif" в этом примере соответствует полному URI "http://www.bestseller.com/images/hornhoof.gif". Заметь 2 вещи: 1."поэтому на практике элемент BASE употребляется только в двух ситуациях". Скажи мне 3-ю, где нада вставлять этот тег?! 2."<BASE href="http://www.bestseller.com/products/intro.html">". Т.е. ссылка должна указывать на документ а не на дирректорию. Получается в твоём варианте неверно указано значение атрибута. |
Я если чесно не тестил, в чём же ошибка и где падает скрипт, но сдаёцца мне, что из-за этого base мы просто не можем найти скрипт вот и всё.
|
Цитата:
Цитата:
Дело не в том, нужно ли использовать тег base, бывают ситуации, когда он нужен, а бывают -- когда над HTML-кодом ты не властен, а всякие умники туда хрень всякую вставляют. |
Вынес в отдельную тему http://javascript.ru/forum/css-html-...a-podumat.html
|
| Часовой пояс GMT +3, время: 01:22. |