设计页面布局5个按钮和一个正方形,使用js实现正方形形状的改变 页面如图

 

帮助到你能点个采纳吗,谢谢~~

<div style="text-align:center">
    <input type="button" onclick="setStyle('width','200px')" value="变宽" />
    <input type="button" onclick="setStyle('height','260px')" value="变高" />
    <input type="button" onclick="setStyle('background-color','#ff0000')" value="变色" />
    <input type="button" onclick="setStyle('display','none')" value="隐藏" />
    <input type="button" onclick="setStyle('reset')" value="重置" />
    <br /><br />
    <div id="div1" style="background: #000; width: 150px; height: 150px; display: inline-block ">

    </div>
</div>
<script>
    var div1 = document.getElementById('div1');
    function setStyle(attr, value) {
        if (attr == 'reset') div1.style.cssText = 'background:#000;width:150px;height:150px;display:inline-block';
        else {
            div1.style[attr] = value;
        }
    }
</script>

 

但凡上课听讲也不至于。常规的Dom 操作,建议先看MDN文档,然后自己实现

点赞不点赞我都不会说什么的

就是点击事件。控制style属性。先获取方块dom 参考这个 https://blog.csdn.net/qq_37860930/article/details/73189214 

https://www.w3school.com.cn/js/js_htmldom_css.asp