如何在 JavaScript 中获取输入文本值？
<script language="javascript" type="text/javascript">
lol = document.getElementById('lolz').value;
function kk(){
alert(lol);
}
</script>
<body>
<input type="text" name="enter" class="enter" value="" id="lolz"/>
<input type="button" value="click" OnClick="kk()"/>
</body>
当我把它放在lol = document.getElementById('lolz').value;函数之外时kk()，如上所示，它不起作用，但当我把它放在里面时，它起作用。谁能告诉我为什么？
函数在lol外部定义时不起作用的原因是，当 JavaScript 首次运行时，DOM尚未加载。因此，getElementById将返回null（参见 MDN）。
您已经找到了最明显的解决方案：通过getElementById在函数内部调用，DOM 将在函数被调用时加载并准备好，并且元素将像您期望的那样被找到。
还有其他一些解决方案。一种是等到整个文档加载完毕，像这样：
<script type="text/javascript">
var lolz;
function onload() {
lolz = document.getElementById('lolz');
}
function kk(){
alert(lolz.value);
}
</script>
<body onload="onload();">
<input type="text" name="enter" class="enter" value="" id="lolz"/>
<input type="button" value="click" onclick="kk();"/>
</body>
注意标签的onload属性<body>。（附带说明：标签的language属性<script>已被弃用。不要使用它。）
但是，存在一个问题onload：它会等待所有内容（包括图像等）加载完毕。
另一种选择是等到 DOM 准备好（通常比 早得多onload）。这可以使用“普通”JavaScript 来完成，但使用像jQuery这样的 DOM 库要容易得多。
例如：
<script type="text/javascript">
$(document).ready(function() {
var lolz = $('#lolz');
var kk = $('#kk');
kk.click(function() {
alert(lolz.val());
});
});
</script>
<body>
<input type="text" name="enter" class="enter" value="" id="lolz"/>
<input type="button" value="click" id="kk" />
</body>
jQuery 的.ready()将函数作为参数。该函数将在 DOM 准备好后立即运行。第二个示例也使用.click()来绑定 kk 的onclick处理程序，而不是在 HTML 中进行内联。
不要以这种方式使用全局变量。即使这可行，也是糟糕的编程风格。您可能会以这种方式无意中覆盖重要数据。改为这样做：
<script type="text/javascript">
function kk(){
var lol = document.getElementById('lolz').value;
alert(lol);
}
</script>
如果你非要var lol设置在函数kk之外，那么我提出这个方案：
<body>
<input type="text" name="enter" class="enter" value="" id="lolz"/>
<input type="button" value="click" OnClick="kk()"/>
<script type="text/javascript">
var lol = document.getElementById('lolz');
function kk() {
alert(lol.value);
}
</script>
</body>
请注意，script元素必须跟在input它所引用的元素之后，因为元素只有getElementById在已经被解析和创建的情况下才能被查询。
两个例子都有效，在 jsfiddler 中测试过。
编辑：我删除了该language="javascript"属性，因为它已被弃用。参见W3 HTML4 规范，SCRIPT 元素：
已弃用。此属性指定此元素内容的脚本语言。它的值是语言的标识符，但由于这些标识符不是标准的，因此该属性已被弃用，以支持类型。
和
不推荐使用的元素或属性已被较新的构造过时。[…] 不推荐使用的元素在未来的 HTML 版本中可能会过时。[…] 该规范包括说明如何避免使用不推荐使用的元素的示例。[…]
<script type="text/javascript">
function kk(){
var lol = document.getElementById('lolz').value;
alert(lol);
}
</script>
<body onload="onload();">
<input type="text" name="enter" class="enter" id="lolz" value=""/>
<input type="button" value="click" onclick="kk();"/>
</body>
用这个
请注意这一行：
lol = document.getElementById('lolz').value;
在<input>标记的实际元素之前：
<input type="text" name="enter" class="enter" value="" id="lolz"/>
您的代码被逐行解析，并且lol = ...在浏览器知props有 id 的输入的存在之前评估该行lolz。因此，document.getElementById('lolz')将返回null，并且document.getElementById('lolz').value应该导致错误。
在函数内移动那条线，它应该可以工作。这样，该行只会在调用函数时运行。并var按照其他人的建议使用，以避免使其成为全局变量：
function kk(){
var lol = document.getElementById('lolz').value;
alert(lol);
}
您还可以将脚本移动到页面的末尾。将所有脚本块移动到 HTML 的末尾<body>是当今避免此类引用问题的标准做法。它还倾向于加快页面加载速度，因为加载和解析需要很长时间的脚本是在（大部分）显示 HTML 之后处理的。
编辑：