mpe*_*pen 5 html javascript jquery
假设你有一些HTML,
<input id="mytextbox" type="text" value="hello world" />
Run Code Online (Sandbox Code Playgroud)
并且你想在加载后立即在该文本框上做一些魔术.无论如何,可能会在它旁边添加某种小部件或按钮.我知道有两种方法可以做到这一点.你可以在这里抛出一些像这样的jQuery<head>
$(function() {
$('#mytextbox').magic();
});
Run Code Online (Sandbox Code Playgroud)
并且一旦整个DOM准备好就会运行,但是如果我们想要更快的话呢?元素加载后很快?
我们可以在元素之后立即放置JS:
<input id="mytextbox" type="text" value="hello world" />
<script>
$('#mytextbox').magic();
</script>
Run Code Online (Sandbox Code Playgroud)
但是这有点麻烦,为什么在我们确切地知道它的位置时我们必须在整个DOM中搜索元素ID?onclick事件有this争论.我们有什么方法可以做这样的事......
<input id="mytextbox" type="text" value="hello world" onload="$(this).magic()" />
Run Code Online (Sandbox Code Playgroud)
?将是最好的解决方案IMO,但只有身体onload显然有一个事件,没有其他事件似乎合适.如果我们想要在加载元素后立即运行一些代码,我们基本上还是要解决方案#2吗?
实际上,您的第二个片段是将某些 Javascript 应用于元素的“最佳”(无论这意味着什么,可能是最快)方法。
<input id="mytextbox" type="text" value="hello world" />
<script type="text/html">
$('#mytextbox').magic();
</script>
Run Code Online (Sandbox Code Playgroud)
您不会在这里搜索整个DOM。这样的调用直接进入
document.getElementById('mytextbox');
Run Code Online (Sandbox Code Playgroud)
这或多或少只是即时访问节点。不管怎样,这样的做法违背了 JavaScript 不显眼的理念。我不知道为什么在DOMContentLoaded事件触发时不应该应用一些代码(由 jQuerys 抽象出来.ready())。