<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<style>
#box{
width:100px;
height:100px;
background: #ddd;
margin-top:30px;
}
</style>
</head>
<body>
<select>
<option>width</option>
<option>height</option>
<option>background</option>
</select>
<input type="text" >
<button id="btn">变化</button>
<div id="box"></div>
</body>
<script>
window.onload=function(){
var oSe=document.getElementsByTagName('select')[0];
var oText=document.getElementsByTagName('input')[0];
var oBtn=document.getElementById('btn');
var oBox=document.getElementById('box');
oBtn.onclick=function(){
if(oSe.value=='background'){
oBox.style[oSe.value]=oText.value;
}else{
oBox.style[oSe.value]=oText.value+'px';
}
}
}
</script>
</html>输入样式,内容随之变化
猜你喜欢
转载自blog.csdn.net/sunjynyue/article/details/82732659
今日推荐
周排行