javascript - 无法使用书签运行外部 javascript

Question

对 JS 完全是新手。

我需要使用一个外部脚本来修改当前页面中的某些元素，并将其作为小书签访问。

如果我修改插入以下 <script> 行的网页的 html 源代码:

s=document.createElement('script');
s.type='text/javascript';
s.src='script.js';
document.getElementsByTagName('head')[0].appendChild(s);

它工作正常。但是如果我用相同的行创建一个 javascript: bookmarklet，我会得到一个包含以下字符串的空白页:

[object HTMLScriptElement]

然而，如果我创建一个书签添加行

void(null);

和之前的一样，网页没有消失，但是脚本没有执行。

为什么？

Answer 1

一个常见的做法是简单地使用一个自执行函数表达式，像这样:

(function () {
  var s=document.createElement('script');
  s.type='text/javascript';
  s.src='script.js';
  document.getElementsByTagName('head')[0].appendChild(s);
}());

书签:

javascript:(function(){var s=document.createElement('script');s.type='text/javascript';s.src='script.js';document.getElementsByTagName('head')[0].appendChild(s);}());

该函数将返回 undefined(未提供返回值)以阻止导航。

另请注意，这将避免创建可能与页面上使用的其他变量重叠的全局变量(如 s)，因为所有变量都是在匿名函数的范围内创建的。