Question

在我的一个项目中，我需要在脚本中执行“自定义”脚本。这是一个很好的例子：

var object = {test : 10};

var script = document.createElement('script');

var condition = $('div').data('if');

script.innerHTML = 
    'function runIf(){\
        with(object){ \
            try{\
                return '+condition+'? true : false;\
            }catch(err){\
                console.log(err.message);\
                return false;\
            }\
        }\
    }';

document.body.appendChild(script)

$('div').toggle(runIf());

document.body.removeChild(script)

我在这样的DOM元素上得到条件：

<div data-if='test>0'>test</div>

在此测试：http://jsfiddle.net/nb234/2/

但是现在，我想知道我是否可以在不向HTML添加内容的情况下获得相同的结果。我不能创建脚本标记（或字符串形式的函数）并运行它吗？

修改

我已经做了另一个例子，希望它有助于理解：http://jsfiddle.net/nb234/4/

Answer 1

您可以使用

eval(string_with_code);

执行你的字符串函数。

Answer 2

您当然可以在不将其添加到<body>元素的情况下运行脚本：而是将其添加到<head>元素中。

document.getElementsByTagName('head')[0].appendChild(script);

除了Snarkiness之外，将元素添加到DOM是动态加载脚本的首选方法，这就是jQuery的$.getScript和requirejs等工具在DOM中插入新的<script>元素的原因。

插入后，您当然可以从DOM中删除脚本，但这并不是必需的。

Answer 3

这是利用javascripts头等功能的理想场所。而不是存储包含javascript的字符串只是在数据中存储实际的javascript函数并将其用作谓词。

function runIf(predicate) {
    return predicate() ? true : false;
}

function pred() {
    return 1==1;
}

alert(runIf(pred) );

注意：不鼓励使用with https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/with

Answer 4

您的所有代码都是这样，不需要脚本标记，evals或语句。

$('div').toggle($('div').data('if'));

运行脚本而不将其添加到HTML

4 个答案: