首先，js代码要做到在网页输入框表单元素中调节指定id标签的图片显示大小需要先创建html标签元素.
代码如下：
效果预览：
<div><img id="tupian" src="1.jpg" ></div>示例图片地址
图片宽度：<input type="text" id="wq-tool" size="18" value=""/>
图片高度：<input type="text" id="wq-com" size="18" value=""/>
<div id="picinfo"></div>
我们创建了一个id名称为tupian的img标签以及id分别为wq-tool、wq-com、picinfo的两个用于调整图片显示大小的文本框与一个用于显示调整实时数值的div标签.
接下来就需要用到js代码对元素进行操作：
<script type="text/javascript">
var tupiandx = document.getElementById('tupian');
var imgwh = new Image();
imgwh.onload = function () {
var w = imgwh.width;
var h = imgwh.height;
document.getElementById('wq-tool').value=imgwh.width;
document.getElementById('wq-com').value=imgwh.height;
document.getElementById('picinfo').innerHTML = "图片预览参数：宽度 "+w+" 高度 "+h;
}
imgwh.src =tupiandx.src;
var wiii=document.getElementById('wq-tool');
var heee=document.getElementById('wq-com');
wiii.oninput = function(){
document.getElementById('picinfo').innerHTML = "图片预览参数： 宽度 "+wiii.value+" 高度 "+heee.value;
tupiandx.style.width=wiii.value+"px";
}
heee.oninput = function(){
document.getElementById('picinfo').innerHTML = "图片预览参数：宽度 "+wiii.value+" 高度 "+heee.value;
tupiandx.style.height=heee.value+"px";
}
</script>
<创建了新的Image对象imgwh，然后需要先定义imgwh.onload函数。
在我们定义的image对象中，用.width与.height属性可以很快的获取指定src图片对象中的图片宽度与高度.然后将它们初始化给调整大小的两个文本框,让它们一开始就有初始值参考.
然后接下来imgwh.src =tupiandx.src;
为定义Image对象的src属性赋值为页面中的图片src地址，这就在浏览器中快速的缓存了一张图片.可以直接用对象的.width与.height属性的到图片的基本信息.
这句话一定要放在imgwh.onload函数后面，因为,当图片加载了一次后，再次对该图片进行请求预览时，由于浏览器已缓存了图片，所以不会再次发送新的请求，而是从浏览器的缓存中加载。。对于常用的浏览器来说，它们一般都会加载图片的onload事件，但部分浏览器ie，就不会再次处理onload事件.所以需要放在后面.
然后用document.getElementById('')来继续拾取id值wq-tool与wq-com的文本框，将它们分别命名为wiii与heee.
当在网页的文本框中写上指定数值时，就会产生oninput事件，这样就能够通过监听oninput事件来动态获取指定id的input输入框数值变化.
heee.oninput = function(){}
当指定的文本框中数字发生变化的时候执行：
document.getElementById('picinfo').innerHTML="图片预览参数";
修改网页中图片所在元素的宽度为wiii绑定对象的value数值.
tupiandx.style.width=wiii.value+"px";
那么通过以上的代码就能在网页中实时调整指定图片元素显示的宽度与高度，然后显示出来.