добавление внешнего .js с использованием DOM, а затем вызов функции из .js - PullRequest
0 голосов
/ 16 сентября 2010

Я пытаюсь построить букмарклет.Я хочу минимизировать размер javascript внутри букмарклета, чтобы большую часть кода можно было сохранить во внешнем файле.Моя цель состоит в том, чтобы ...
1) Добавить внешний файл .js на страницу.
2) Вызвать функцию из этого внешнего файла .js.
3) Пусть эта функция добавит дополнительные файлы .js.на страницу (например, источник JQuery).

Вот мой код для номера 1. Он работает.

javascript:function bmksMain(){var script=document.createElement('script');script.src='http://localhost/bmks/bmksBmkMain.js';scriptObj=document.body.appendChild(script);}bmksMain();

Вот содержимое файла .js.

function bmksBmkMaster(){
      alert('debug1');
    var script, object;
    script = document.createElement('script');
    script.src = 'http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js';
    object = document.body.appendChild(script);
      alert('debug2');
    $("body").hide();
      alert('debug3');
}
bmksBmkMaster();

Когда я вставляю код букмарклета в адресную строку и выполняю, отладки 1 и 2 запускаются, а затем умирают.Затем, если я выполню снова без обновления страницы , все три отладки сработают, и все это прекрасно работает.

Могу ли я не включать .js и использовать его внутри одной функции / скрипта?Происходит что-то интересное ...

Заранее спасибо!

(протестировано в IE7 и последней версии Chrome)

Ответы [ 2 ]

0 голосов
/ 16 сентября 2010

Вот кросс-браузерный способ загрузки скриптов:

function loadScript(scriptUrl, callback){
    var script = document.createElement('script');
    script.type='text/javascript';
    script.onload = function(){
        callback(); 
            callback = function(){};

    }
    script.onreadystatechange = function () {
        if(script.readyState === 'loaded' || script.readyState === 'complete'){
            callback();
                    callback = function(){};
        } 
    }
    script.src = scriptUrl;
    document.getElementsByTagName('head').item(0).appendChild(script);
}

Вы можете использовать его так:

loadScript('http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js', function(){
  //hide body
});
0 голосов
/ 16 сентября 2010

Посмотрите статью jQuerify Bookmarklet и ее наследников, чтобы узнать, как это сделать. (Например, использование глобального идентификатора $ нецелесообразно.)

...