前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >文字搬运工

文字搬运工

作者头像
IT人一直在路上
发布2019-09-18 10:57:48
6240
发布2019-09-18 10:57:48
举报
文章被收录于专栏:前端重点笔记
代码语言:javascript
复制
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>文字搬运工</title>
    <style>
        .nav{border: 5px blue solid;float: left}
        .left{float:left;margin:30px;border:3px red solid;width: 300px;height: 200px;}
        .right{float: left;margin: 30px;border:3px black solid;width:300px;height: 200px;}
        button{position:relative;top: 30px;float: left;}
    </style>
</head>
<body>
<div class="nav">
   <textarea class="left"></textarea>
    <button>文字右移</button>
    <textarea class="right"></textarea>
</div>
<script>
    window.onload=function () {
        var textLeft=document.getElementsByClassName("left")[0];
        var textRight=document.getElementsByClassName("right")[0];
        var button=document.getElementsByTagName("button")[0];
        button.onclick=function () {
            textRight.value+=textLeft.value;
            textLeft.value="";
        }
    }
</script>
</body>
</html>

效果:

注释:左框输入,点击按钮,文字转移到右框

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2018-11-26 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档