Javascript 运行脚本而不将其添加到HTML
在我的一个项目中,我需要在脚本中执行一个“自定义”脚本。它正在工作,这里有一个小例子:Javascript 运行脚本而不将其添加到HTML,javascript,Javascript,在我的一个项目中,我需要在脚本中执行一个“自定义”脚本。它正在工作,这里有一个小例子: var object = {test : 10}; var script = document.createElement('script'); var condition = $('div').data('if'); script.innerHTML = 'function runIf(){\ with(object){ \ try{\
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>
测试
在这里测试它:
但是现在,我想知道我是否可以在不向HTML添加任何内容的情况下得到相同的结果。我不能创建一个脚本标记(或字符串形式的函数)并运行它吗
编辑:
我已经做了另一个例子,希望它能帮助您理解:您当然可以运行脚本,而无需将其添加到
元素:将其添加到
元素
document.getElementsByTagName('head')[0].appendChild(script);
除此之外,将元素添加到DOM是动态加载脚本的首选方法,这就是为什么jQuery的$.getScript
和requirejs等工具将新的
元素插入DOM的原因
插入脚本后,您当然可以将其从DOM中删除,但这并不是必须的。您可以使用
eval(string_with_code);
执行字符串函数。这是利用javascripts一流函数的最佳场所。与其存储包含javascript的字符串,不如在数据中存储实际的javascript函数,并将其用作谓词
function runIf(predicate) {
return predicate() ? true : false;
}
function pred() {
return 1==1;
}
alert(runIf(pred) );
注意:不鼓励使用with您的代码所做的就是这样,它不需要脚本标记、eval或with语句
$('div').toggle($('div').data('if'));
你的意思是你合法使用了
eval(code)
?我试图理解你在示例代码中做了什么。。。为什么不在代码中创建一个函数runIf(){…}
,在toggle
调用中使用它,然后分配runIf=null
?@Brian我正试图使用eval()
,但什么都不能用@Steve,我需要检查用户在DOM中的数据中插入的条件,如果,可以有多个DOM元素和一个数据,并且它可以包含一个复杂的条件。我知道with是不受鼓励的,但在我的情况下,这并不重要,它实际上完全符合我的要求(谈论第二个缺点)。实际上,将与
一起使用非常重要。另外,您的代码不使用data-attribute。上面是您应该使用的模式的一个示例。不幸的是,您的代码结构很差。您不应该在div的数据中存储javascript字符串。我正在尝试为非高级用户创建一个插件。用户使用它越容易,它就越好。如果用户必须在数据中使用完整的函数,如果
没有实现我的目标。我没有解释清楚:)我想知道我是否可以运行代码而不将其插入HTML。此外,由于存在多个DOM元素和数据if
属性,脚本也会更改。如何将eval wtih与(object)
一起使用?With在我的例子中非常重要。什么看起来像“条件”变量?为什么“with”如此重要?因为它会用var对象中的变量检查条件,但是如果object.test
不存在,它会检查test
是否是全局变量。可能:script.innerHTML='function runIf(){\return object.+condition+'?true:false;\};然后,如果这个变量是一个全局变量,那么这个条件将失败。这不是我的代码所做的。用户编写HTML并在data if
中输入条件,如果
,它可以类似于data。它检查myAge
和myName
可以位于由我的代码创建的定义对象或用户创建的自定义变量中的条件。