对象说睡前要敲几行代码

来源：互联网发布：王者荣耀显示网络异常编辑：程序博客网时间：2024/06/06 14:10

大概要实现以下效果
这里写图片描述
其实是对象说，睡觉前要写一100行代码；
无奈我也不知道些什么，就胡诌了以下的代码；
没有考虑封装，只是单纯敲出来；

<!DOCTYPE html><html ><head>    <meta charset="UTF-8">    <title>oop</title>    <style>        #div{            width:100px;            height:100px;            background:yellow;        }    </style></head><body><div id="div"></div><div id="div2">    <label for="op">透明度</label><input type="text" id="op">    <label for="w">宽度</label><input type="text" id="w"></div><button id="tb">点我设置透明度</button><button id="tb2">点我设置宽度</button><button id="setAll">一键设置</button><script>//获取id    function getById(id) {        return document.getElementById(id)    }    //变化opacity的，不考虑兼容性    var move=function (id,op) {        var tar=getById(id);        setopacity(id,op);    }    //设置opacity的方法；    function setopacity(id,op){        return id.style.opacity=op;    }    //设置id的宽度    function setWidth(id,w){        return getById(id).style.width=w+"px";    }    //获取id的输入值    function getVal(id){        return getById(id).value;    }    //设置按钮点击事件    getById("tb").onclick=function(){        move(getById("div"),getVal("op"))    }    getById("tb2").onclick=function(){      setWidth("div",getVal("w"))    }    getById("setAll").onclick=function(){            if(getVal("op")){                move(getById("div"),getVal("op"));            }            if(getVal("w")){                setWidth("div",getVal("w"))            }    }</script></body></html>

总结：
对象说：你写了一些没用的。。。。可以睡觉了

阅读全文

0 0