Question

我想要做的是将所有JavaScript与页面分开，因此它适用于所有禁用JavaScript的程序，但也可以使用闭包编译器的高级编译（http：//closure-compiler.appspot）进行编译。 COM /家）。

以下是我的开始：

...从

<a href="javascript:doMultiple('download', 'release');">Create archive</a>

为...

<a class="javascript doMultiple download release" href="ca.php">CreateArchive</a>

然后我循环所有对象以找到首先有类javascript等等:( links是a标签的数组）

for (i = 0; i < links.length; i = i + 1) {
    if (links[i].className.substr(0, 10) === "javascript") {
        jsArray = links[i].className.split(" ");
        links[i].style.display = "inline";
        if (links[i].addEventListener) {
            links[i].addEventListener("click", window[jsArray[1]], false);
        } else {
            links[i].onclick = window[jsArray[1]];
        }
        links[i].href = "#";
    }
}

使用这种方法，javascript压缩器将删除函数doMultiple，因为它没有被使用，因为它知道我有一个类...

我的问题是，我怎么能解决这个问题，如果我不能解决，我能以某种方式摆脱窗口[jsArray [1]]并以另一种方式解决这个问题吗？因为我认为这不是最好的方法。

课程也可以是：

<a class="javascript popUp register.php 350 300" href="register.php">Register</a>

所以我想使用这种方法动态添加所有JavaScript。

最好的问候，
约翰斯文森

Answer 1

你不应该让事情变得复杂。将事件附加到DOM元素会更好。

我强烈建议您使用像jQuery这样的JavaScript框架，甚至可以使用纯JavaScript来实现这一点。

例如

<a href="#" id="createArchive" class="remove otherClass">Create archive</a>

OR

<a href="#" id="createArchive" class="release otherClass">Create archive</a>

对于JavaScript：

var element = document.getElementById("createArchive");

var handler = function() {
        // this line will execute only on IE
        // you need an if-else case to test
        // against the browser other than IE
        // and use this.class.split
        var classes = this.className.split(' ');

        doMultiple('download', classes[0]);
        // or anything you want to on this click event
};

if (element && element.attachEvent) {
    // This is for IE
    element.attachEvent("onclick", handler);
}
else if (element && element.addEventListener) {
    // This is for rest of the world
    element.addEventListener("click", handler, false);
}

如果你使用jQuery，生活很简单

$("#createArchive").bind("click", function() {
    doMultiple('download', 'release');
});

这就是它，并且还要注意HTML中没有 JavaScript 代码。

问题2

对于Google Closure Compiler，您必须使用排除您不希望编译/缩小的功能。

您应该有一个.JS文件，其中包含要排除的函数名称。

您的exclude.js应包含以下函数的签名：

function doMultiple() { }
function popUp() { }

从命令行运行此命令以使用闭包编译器进行编译

java -jar .\compiler.jar --compilation_level ADVANCED_OPTIMIZATIONS --js input_script_file.js --js_output_file=compiled.min.js --externs exclude.js

希望这有帮助。 请随时提出任何问题

Answer 2

首先，使用var关键字作为局部变量。变量jsArray是全局变量，因为您之前没有使用var关键字，这基本上是错误的（在这种情况下它不应该是全局的）。

其次，您可以使用标记的data-属性传递其他数据。以下是：

<a class="javascript popUp register.php 350 300" href="register.php">Register</a>

可以更改为更有意义的：

<a data-window-type="popUp" data-popup-height="350" data-popup-width="300" href="register.php">Register</a>

因此，您拥有先前存储在class属性中的所有数据（除非它是多余的）。访问它就像访问任何其他标记属性一样简单。

当谈到您当前的代码时，我认为它过于复杂，我不确定您想要实现的目标。只需遵循上述规则，您的代码可能会更简单。

Answer 3

我很高兴有人试图摆脱＆＃34; javascript：＆＃34;来自链接的电话。 :-D

这很简单。将其分为＆＃34;分层＆＃34;步骤，这是你要做的：

循环浏览具有您指定的类名的链接;
将它们绑定到一个事件监听器，它将触发任何操作。

作为初步说明，您应该考虑采用更好的方法来处理这个问题。只是＆＃34;转换＆＃34;对此的JavaScript调用不是好事，因为它会1）需要丑陋的黑客来完成你想要的东西，2）仍然违背内容语义：类名也是内容;他们并不打算作为行为或造型。

在你想到一个更好的方法之后 - 我确定你会轻易找到一个 - 你会这样做基本上做你已经做过的事情;它只需要一些JavaScript爱：

首先，定义行动。

function the_action(event)
{
    // Prevents the browser of following the link's href.
    // "javascript:void(0)" or "#" are for dumbs. ;-)
    event.preventDefault();

    // You can reuse the original href!
    // (like any other attribute or element property)
    // "this" is the DOM element.
    var link_url = this.getAttribute('href');

    alert('lol!');
}

现在，循环访问这些链接并添加侦听器的更好方法是：

var selector = 'a.foobar'
  , links = document.querySelectorAll(selector);

i = links.length; while(i--)
{
    links[i].addEventListener('click', the_action, false);
}

请注意，我在循环之前定义了函数，因为如果我把它放入在addEventListener调用中，它将创建一个新的Function对象对于列表中的每个元素。

另请注意，在上面的代码段中，我使用的代码仅在现代浏览器。如果你必须支持IE，我建议你得到一个简单的JavaScript库，将标准化＆＃34;的东西。关于这个，你可以选择jQuery - 我不喜欢它，但这是另一个长时间的对话 - ，Mootools， Mandoo和其他人。这是关于哲学/品味的。： - ）

挑选图书馆也会使你的代码更加清晰。保持良好状态！

动态调用函数javascript

3 个答案:

问题2