留言框

最新推荐文章于 2024-01-04 10:24:21 发布

hsdjhaiwhdnjw

最新推荐文章于 2024-01-04 10:24:21 发布

阅读量522

点赞数

CC 4.0 BY-SA版权

分类专栏：总结

本文链接：https://blog.youkuaiyun.com/qq_41604686/article/details/92773324

总结专栏收录该内容

34 篇文章

订阅专栏

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title></title>
    <style>
        #box {
            width: 300px;
            height: 200px;
            border: 1px solid black;
        }
    </style>
</head>
<body>
<ul id="box">
    <!--<li>你好</li>
    <li>在吗</li>-->
</ul>
<span>张三:</span><input type="text" />
<input type="button" value="发送留言" />
</body>
<script type="text/javascript">
    /*
     *  思路： 写完文本框中的文字 然后单击按钮 发送文字 到ul框框中
     *
     * */

    // 1 要想玩元素 先获取元素  按钮  文本框  span ul
    var oBox=document.getElementById("box");
    var aSpan=document.getElementsByTagName("span")[0];
    var aInp=document.getElementsByTagName("input");
    aInp[1].οnclick=function(){
        var str =aInp[0].value
        oBox.innerHTML+='<li><strong>'+aSpan.innerHTML+'</strong>'+str+'</li>';
        aInp[0].value="";
    }
    aSpan.οnclick=function(){
        var onOff=true;
        if(onOff){
            aSpan.innerHTML="李四："
        }else {
            aSpan.innerHTML="张三："
        }
        onOff=!onOff;
    }









   /* var oBox=document.getElementById("box");
    var aInp=document.getElementsByTagName("input");
    var aSpan=document.getElementsByTagName("span")[0];
    aInp[1].οnclick=function(){
        var str=aInp[0].value;
//        oBox.innerHTML=aInp[0].value;
//        oBox.innerHTML+="<li><strong>"+aSpan[0]+"</strong>"+str+"</li>";
        oBox.innerHTML +=  "<li><strong style='color:red'>"+ aSpan.innerHTML+"</strong>" + str +"</li>";
        aInp[0].value=""
    }
    var onOff=true;
    aSpan.οnclick=function(){
        if(onOff){
            this.innerHTML="李四:"
        }
        else {
            this.innerHTML="张三:"
        }
        onOff=!onOff;
    }

*/

</script>
</html>