狗王 发表于 2020-3-14 16:09:32

js大小写转换

新建3-5.html文件，在<body></body>中插入JavaScript脚本，在页面中显示如下图，原数据中输入的字符串转换为大小写。



body部分的代码如下，请各位同学完成Javascript部分代码。
<body>
                <h2>大小写转换</h2>
    <p>原数据：<input id="old" type="text"></p>
    <p>
      操作：
      <input type="button" value="转大写">
      <input type="button" value="转小写">
    </p>
<p>新数据：<input id="new" type="text"></p>

<script type="text/javascript">
                           请填写完整代码
                </script>
      </body>
备注：onclick为鼠标点击事件，绑定到javascript中定义的deal函数上。大小写字母的转换可以用str.toUpperCase()方法和str.toLowerCase()。str为字符串变量。

狗王 发表于 2020-3-14 16:31:02

本帖最后由 狗王 于 2020-3-14 16:40 编辑

                        var old = document.getElementById('old');
                        var str = "";
                        var p = document.getElementsByTagName('p');
                        deal = function (){
                                for(var i = 0;i<old.value.length;i++){
                                        if(old.value.charCodeAt()<=122 && old.value.charCodeAt()>=97)
                                        {
                                                str += old.value.toUpperCase();
                                        }
                                        else
                                        {
                                                str += old.value.toLowerCase();
                                        }
                                }
                        }
                        document.getElementById('new').innerHTML = str;
这里拿错了？

wp231957 发表于 2020-3-14 16:49:51

狗王 发表于 2020-3-14 16:31
var old = document.getElementById('old');
                        var str = "";
                        var p = document.getElementsByTag ...

funtion函数名(形参列表){内容}

狗王 发表于 2020-3-14 17:23:32

大佬把代码写出来把
{:5_105:}

wp231957 发表于 2020-3-14 17:51:15

狗王 发表于 2020-3-14 17:23
大佬把代码写出来把

<!doctype html>
<html>
    <head>
      <meta charset="gb2312">
      <title>jQuery</title>
    </head>
    <body>
      <h2>大小写转换</h2>
      <p>原数据：<input id="old" type="text"></p>
      <p>
          操作：
          <input type="button"onclick="javascript:deal(this)" value="转大写">
          <input type="button"onclick="javascript:deal(this)" value="转小写">
      </p>
      <p>新数据：<input id="new" type="text"></p>

      <script type="text/javascript">
            function deal(a){
                if(a.value=="转大写"){
                  document.getElementById('new').value = document.getElementById('old').value.toUpperCase();
                }
                if(a.value=="转小写"){
                  document.getElementById('new').value = document.getElementById('old').value.toLowerCase();
                }
            }
      </script>
    </body>
</html>
页: [1]
查看完整版本: js大小写转换