本文探讨了在JavaScript中点击按钮修改input元素value属性时，为何HTML结构上未显示变化的问题。虽然页面显示value已更新，但HTML源代码中并未反映出这一修改。原因在于JavaScript通过DOM操作改变的是浏览器的呈现，而非文档内容本身。input的value属性仅设置默认值，JavaScript修改value不会更新HTML显示，除非初始没有设定默认value。
代码：
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style>
span{background:lime;}
</style>
<script>
window.οnlοad=function(){
//获取input、span
var oTxt=document.getElementsByTagName('input')[0];
var oBtn=document.getElementsByTagName('span')[0];
//span在点击的时候，修改input的value值，
//且给input加一个类“on”
oBtn.οnclick=function(){
oTxt.value=10;
oTxt.className='on';
};
};
</script>
</head>
<body>
<input type="text" value="哈哈" />
<span>onclick</span>
</body>
</html>
未点击onclick
最低0.47元/天 解锁文章
扫一扫
675
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
