javascript - 如何从书签加载外部 css、js 并将 div 附加到 DOM？

Question

我正在尝试构建一个执行以下操作的小书签:

1.)加载位于我的服务器上的外部 js(完成)

javascript:function%20loadScript(scriptURL)%20{%20var%20scriptElem%20=%20document.createElement('SCRIPT');%20scriptElem.setAttribute('language',%20'JavaScript');%20scriptElem.setAttribute('src',%20scriptURL);%20document.body.appendChild(scriptElem);}%20loadScript('http://127.0.0.1/main.js?x='+Math.random());

2.) 这个外部 javascript 依次加载 jquery 和 jquery ui，而不是将 div 添加到当前站点 DOM 中。 (不能让它工作)

function loadScripts(scriptURL) {


 var scriptElem = document.createElement('SCRIPT');
 scriptElem.setAttribute('language', 'JavaScript');
 scriptElem.setAttribute('src', scriptURL);
 void(document.body.appendChild(scriptElem));
}


loadScripts('http://127.0.0.1/js/jquery-1.3.2.min.js');
loadScripts('http://127.0.0.1/js/jquery-ui-1.7.2.custom.min.js');


var head = document.getElementsByTagName('head')[0]; 
$(document.createElement('link')).attr({type: 'text/css', href: 'http://127.0.0.1/css/redmond/jquery-ui-1.7.2.custom.css', rel: 'stylesheet'}).appendTo(head);



$(document).ready(function(){
    div = $("<div>").html("Loading......");
    $("body").prepend(div);
});

我遇到的问题是我无法附加具有特定 id 的 div，我的想法是使用 jqueryui 的 dialog() 函数，以便在我使用的任何网站上出现一个可调整大小、可移动的对话框书签上。

$("#dialog").dialog(); 

正如您想象的那样，我需要将我的内容加载到特定的 div 中，这样我就不会搞乱加载书签的网站的设计。

3.)刚刚打开的对话框有一个远程php文件的内容，基本上解析了页面。

脚本已完成，我只需要将它加载到我正在尝试构建的对话框中即可。

请帮忙，因为我真的被这个问题困住了!谢谢。

Answer 1

这有帮助吗？这是给您带来问题的部分吗？

$("<div id='id'></div>").html("Loading......");

jQuery 文档说:

All HTML must be well-formed, otherwise it may not work correctly across all browsers. This includes the case where $("<span>") may not work but $("<span/>") will (note the XML-style closing slash).