第32天:微博发布动态

简介: 微博发布动态DOCTYPE html> 微博发布 ul{ list-style:none; } *{ margin: 0; padding: 0; } .

微博发布动态

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>微博发布</title>

    <style>
        ul{
            list-style:none;
        }
        *{
            margin: 0;
            padding: 0;
        }
        .box{
            margin:100px auto;
            width: 600px;
            height: auto;
            border: 1px solid #333333;
            padding: 30px 0;

        }
        textarea{
            width: 400px;
            resize: none;/*防止用户拖动 右下角*/

        }
        .box li{
            width: 400px;
            line-height: 30px;
            border-bottom: 1px dashed #c1c1c1;
            margin-left: 80px;
        }
        .box li a{
            float: right;;
        }
    </style>
    <script>
        window.onload=function(){
            //获取对象
            var btn=document.getElementsByTagName("button")[0];
            var txt=document.getElementsByTagName("textarea")[0];
            var ul=document.createElement("ul");
            btn.parentNode.appendChild(ul);
            btn.onclick=function(){
                if(txt.value==""){
                    alert("输入不能为空");
                    return false;//终止函数执行
                }
                
                var newli=document.createElement("li");
                newli.innerHTML=txt.value+"<a href='javascript:;'>删除</a>";
                txt.value="";
                var lis=ul.children;//获得由多少个li
                if(lis.length==0){
                    ul.appendChild(newli);
                }else{
                    ul.insertBefore(newli,lis[0]);//每次新增的li放到上一个的前面
                }
                var as=document.getElementsByTagName("a");
                for(var i=0;i<as.length;i++){
                    as[i].onclick=function(){
                        ul.removeChild(this.parentNode);//a的爸爸是li
                    }
                }
            }



        }
    </script>
</head>
<body>
    <div class="box">
        微博发布:<textarea name="" cols="30" rows="10"></textarea><button id="btn">发布</button>
        <!--<ul id="ul">-->
            <!--<li>123</li>-->
            <!--<li>123</li>-->
            <!--<li>123</li>-->
        <!--</ul>-->
    </div>
</body>
</html>

运行效果:

 

相关文章
|
15天前
|
存储 弹性计算 人工智能
【2025云栖精华内容】 打造持续领先,全球覆盖的澎湃算力底座——通用计算产品发布与行业实践专场回顾
2025年9月24日,阿里云弹性计算团队多位产品、技术专家及服务器团队技术专家共同在【2025云栖大会】现场带来了《通用计算产品发布与行业实践》的专场论坛,本论坛聚焦弹性计算多款通用算力产品发布。同时,ECS云服务器安全能力、资源售卖模式、计算AI助手等用户体验关键环节也宣布升级,让用云更简单、更智能。海尔三翼鸟云服务负责人刘建锋先生作为特邀嘉宾,莅临现场分享了关于阿里云ECS g9i推动AIoT平台的场景落地实践。
【2025云栖精华内容】 打造持续领先,全球覆盖的澎湃算力底座——通用计算产品发布与行业实践专场回顾
|
7天前
|
云安全 人工智能 安全
Dify平台集成阿里云AI安全护栏,构建AI Runtime安全防线
阿里云 AI 安全护栏加入Dify平台,打造可信赖的 AI
|
10天前
|
人工智能 运维 Java
Spring AI Alibaba Admin 开源!以数据为中心的 Agent 开发平台
Spring AI Alibaba Admin 正式发布!一站式实现 Prompt 管理、动态热更新、评测集构建、自动化评估与全链路可观测,助力企业高效构建可信赖的 AI Agent 应用。开源共建,现已上线!
928 29
|
9天前
|
机器学习/深度学习 人工智能 搜索推荐
万字长文深度解析最新Deep Research技术:前沿架构、核心技术与未来展望
近期发生了什么自 2025 年 2 月 OpenAI 正式发布Deep Research以来,深度研究/深度搜索(Deep Research / Deep Search)正在成为信息检索与知识工作的全新范式:系统以多步推理驱动大规模联网检索、跨源证据。
670 52
|
3天前
|
监控 BI 数据库
打工人救星!来看看这两家企业如何用Quick BI让业务更高效
Quick BI专业版监控告警助力企业高效运作,通过灵活配置规则与多渠道推送,让数据异常早发现、快响应,推动业务敏捷决策与持续增长。
打工人救星!来看看这两家企业如何用Quick BI让业务更高效
|
7天前
|
文字识别 测试技术 开发者
Qwen3-VL新成员 2B、32B来啦!更适合开发者体质
Qwen3-VL家族重磅推出2B与32B双版本,轻量高效与超强推理兼备,一模型通吃多模态与纯文本任务!
585 11