如何在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>
注意 <body> 标签的 onload 属性。 (顺便提一下：<script> 标签的 language 属性已经被弃用，请不要使用。)
然而，onload 存在一个问题：它会等待直到所有内容（包括图像等）都加载完成。
另一个选项是等待 DOM 准备就绪（通常比 onload 早得多）。这可以使用“纯” JavaScript 完成，但使用 DOM 库（如jQuery）会更容易。
例如：
<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，那么我提出以下解决方案：<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 进行查询。language="javascript" 属性，因为它已被弃用。请参见 W3 HTML4 Specification, the SCRIPT element。<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 = ...行在浏览器知道存在id为lolz的输入之前就被评估了。因此，document.getElementById('lolz')将返回null，document.getElementById('lolz').value应该会导致错误。
将该行移至函数内部，则应该可以正常工作。这样，只有在调用函数时才会运行该行。并像其他人建议的那样使用var，以避免将其变成全局变量：
function kk(){
var lol = document.getElementById('lolz').value;
alert(lol);
}
您还可以将脚本移到页面末尾。将所有脚本块移到HTML <body> 的末尾是今天的标准做法，以避免此类引用问题。它还倾向于加快页面加载速度，因为需要长时间加载和解析的脚本将在HTML被（大部分）显示后处理。
undefined 赋值给 lol，而是会导致 JavaScript 错误。 - bfavaretto编辑：
var textbox;
function onload() {
//Get value.
textbox = document.getElementById('textbox');
}
function showMessage() {
//Show message in alert()
alert("The message is: " + textbox.value);
}<body onload="onload();">
<div>
<input type="text" name="enter" class="enter" placeholder="Write something here!" value="It´s a wonderful day!" id="textbox"/>
<input type="button" value="Show this message!" onClick="showMessage()" />
</div>function kk(){
var lol = document.getElementById('lolz').value;
alert(lol);
}
<script>
function subadd(){
subadd= parseFloat(document.forms[0][0].value) + parseFloat(document.forms[0][1].value)
window.alert(subadd)
}
</script>
<body>
<form>
<input type="text" >+
<input type="text" >
<input type="button" value="add" onclick="subadd()">
</form>
</body>
lol = document.getElementById('lolz').value;
function kk() 内部。fun_inside() 中调用该变量。function fun_inside() {
lol = document.getElementById('lolz').value;
}
function kk() {
fun_inside();
alert(lol);
}
当您构建复杂项目时，这将非常有用。
<input type="password"id="har">
<input type="submit"value="get password"onclick="har()">
<script>
function har() {
var txt_val;
txt_val = document.getElementById("har").value;
alert(txt_val);
}
</script>