Question

我正在尝试创建一个Javascript文件，我可以从其他域引用这些文件，以便更改用户页面的外观。

例如，javascript文件（www.mywebsite.com/123.js）将在www.userwebsite.com上引用，可能包含以下内容：

var thebody = document.getElementsByTagName('body')[0];
var newdiv = document.createElement('div');
var txtNode = document.createTextNode("Hello. This is a new node.");   
var divIdName = "mydiv";
var csslink = "http://www.anotherwebsite.com/style.css";
var newcss = document.createElement('link');
newcss.setAttribute('href',csslink);
newcss.setAttribute('rel','stylesheet');
newcss.setAttribute('type','text/css');
newdiv.setAttribute('id',divIdName);
newdiv.appendChild(txtNode);
thebody.appendChild(newdiv);
thebody.appendChild(newcss);

哪个会插入对用户网站上托管的CSS文件的引用，以及使用文本节点“Hello。这是一个新节点”向DOM添加新div。

我希望用户能够登录CMS（我将构建），以便他们可以更改打印到页面的文本，而无需更改我提供给他们的Javascript文件。 CMS将托管在我的网站上。

这样做的最佳做法是什么？

显然，我可以远程编辑javascript文件而无需用户更改任何内容 - 但这是更新脚本的最佳方法吗？

我正在考虑在javascript中有一个Ajax请求，该请求从引用mysql数据库的php文件中检索输出，该文件包含用户想要更改的文本 - 但是，相同的源策略意味着这是不可能的。

由于

Answer 1

您不需要使用AJAX来检索PHP输出;让客户端在其页面中添加<script />标记，并将src属性设置为PHP输出;只需确保您的脚本发出有效的JavaScript。

由于您的Web服务器现在认为它是在PHP域而不是JS资产中，请务必发出正确的页眉;我想到了MIME类型和到期时间。

header('Content-Type: application/x-javascript');
header('Last-Modified: Mon, 03 Sep 2012 22:33:44 GMT');

此外，请注意脚本将执行的不可靠和“恶意”环境。您应该最小化JavaScript脚本声明的全局变量数量，以降低冲突风险。最简单的方法是将代码包装在IIFE中;

// Look ma, no global variables!
(function () {

var thebody = document.getElementsByTagName('body')[0];
var newdiv = document.createElement('div');
var txtNode = document.createTextNode("Hello. This is a new node.");   
var divIdName = "mydiv";
var csslink = "http://www.anotherwebsite.com/style.css";
var newcss = document.createElement('link');
newcss.setAttribute('href',csslink);
newcss.setAttribute('rel','stylesheet');
newcss.setAttribute('type','text/css');
newdiv.setAttribute('id',divIdName);
newdiv.appendChild(txtNode);
thebody.appendChild(newdiv);
thebody.appendChild(newcss);

}());

您还应该考虑为CSS类添加前缀，元素ID等，以最大限度地减少与主机命名方案的冲突。

使用PHP更新外部.js中的Javascript变量？

1 个答案: