【JavaScript自学笔记-入门篇】第4章 编程挑战

举报
琪哥能酷 发表于 2022/12/29 15:33:14 2022/12/29
【摘要】 请编写"改变颜色"、"改变宽高"、"隐藏内容"、"显示内容"、"取消设置"的函数,点击相应按钮执行相应操作,点击"取消设置"按钮后,提示是否取消设置,如是执行操作,否则不做操作

学习教程来源:慕课网-JavaScript入门篇 by:慕课官方号

小伙伴们,请编写"改变颜色"、"改变宽高"、"隐藏内容"、"显示内容"、"取消设置"的函数,点击相应按钮执行相应操作,点击"取消设置"按钮后,提示是否取消设置,如是执行操作,否则不做操作。

我的写法:

<!DOCTYPE HTML>

<html>

    <head>

        <meta charset="" />

        <title>编程练习</title>

        <style>

            .cc{

                color=green;

                weight=10px;

                height=10px;

            }

            .one{

                color=red;

            }

            .two{

                weight=30px;

                height=30px;

            }

        </style>

        <script>

            var mye=document.getElementById("ii");

            var myclass=mye.className();

            function changeColor(){                        //改变颜色函数

                mye.style.color="red";

            }

            function changeWeightAndHeight(){

               mye.className="two";

            }

            function changeDisplayNone(){

               mye.style.display="none";

            }

            function changeDisplayBlock(){

               mye.style.display="block";

            }

            function changeInitialization(){

               mye.className="cc";

            }

        </script>

    </head>

    <body>

        <p id="ii" class="cc">段落标签元素文本</p> <!--我是一个段落标签-->

        <form>

            <input type="bottom" value="点击改变颜色" onclick="changeColor()" />

            <input type="bottom" value="点击改变宽高" onclick="changeWeightAndHeight()" />

            <input type="bottom" value="点击隐藏内容" onclick="changeDisplayNone()" />

            <input type="bottom" value="点击显示内容" onclick="changeDisplayBlock()" />

            <input type="bottom" value="点击取消设置" onclick="changeInitialization()" />

        </form>

    </body>

</html>

参考答案

【版权声明】本文为华为云社区用户原创内容,转载时必须标注文章的来源(华为云社区)、文章链接、文章作者等基本信息, 否则作者和本社区有权追究责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@huaweicloud.com
  • 点赞
  • 收藏
  • 关注作者

评论(0

0/1000
抱歉,系统识别当前为高风险访问,暂不支持该操作

全部回复

上滑加载中

设置昵称

在此一键设置昵称,即可参与社区互动!

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。