Question

我正在尝试使用javascript从firefox更改任何已加载网页的背景。我安装了apache web服务器。在从firebug的控制台加载站点后，我在任何站点（例如stackoverflow.com）上运行以下代码。

测试1：来自localhost的css文件

var s = document.createElement('link');
s.setAttribute('href', 'http://localhost/new1.css');
s.setAttribute('rel', 'stylesheet');
s.setAttribute('type', 'text/css');
document.getElementsByTagName('head')[0].appendChild(s);
alert('Stylesheet injected!');

以上代码适用于stackoverflow.com wikipidea.com。 new1.css文件成功从本地服务器加载。 BUt此代码不适用于google.com和yahoo.com以及许多其他代码。

http://localhost/new1.css

的内容

body { background-color: #0000ee !important; }

我在firebug控制台中运行代码，以下内容出现在html

的头部

<link type="text/css" rel="stylesheet" href="http://localhost/new1.css">

Test2：来自dropbox的css文件

var s = document.createElement('link');
s.setAttribute('href', 'https://dl.dropboxusercontent.com/s/cdio6v4wiqj7g1i/new1.css?dl=1&token_hash=AAFsujreqLbTBoBcn5oF4CE0x2YKzuZG4RbYS27W0b0TUA');
s.setAttribute('rel', 'stylesheet');
s.setAttribute('type', 'text/css');
document.getElementsByTagName('head')[0].appendChild(s);
alert('Stylesheet injected!');

结果：适用于任何网站：

https://dl.dropboxusercontent.com/s/cdio6v4wiqj7g1i/new1.css?dl=1&token_hash=AAFsujreqLbTBoBcn5oF4CE0x2YKzuZG4RbYS27W0b0TUA

的内容

body { background-color: #0000ee !important; }

我在firebug控制台中运行代码，以下内容出现在html

的头部

<link type="text/css" rel="stylesheet" href="https://dl.dropboxusercontent.com/s/cdio6v4wiqj7g1i/new1.css?dl=1&token_hash=AAFsujreqLbTBoBcn5oF4CE0x2YKzuZG4RbYS27W0b0TUA">

任何人都可以找出为什么通过localhost提供的css文件不起作用，而dropbox提供的同一个css文件适用于google.com

Answer 1

您无法在HTTPS网站中从HTTP加载资源。

如果您查看控制台，您会看到一条警告说明这一点。

对于某些网页，css文件无法从localhost运行

1 个答案: