私聊前端页面的编写

<p> 输入发送的信息 <input type="text" id="send_id">
    <button onclick="send_func()">发送</button>
</p>

<div id="data_id">


</div>

</body>
<script type="application/javascript">

    var ak=null;
    function lg_func() {

        //拿到input 登录 的用户名
        var username = document.getElementById('login_id').value;



        ak = new WebSocket("ws:127.0.0.1:5000/ak/"+username);
    ak.onopen = function () {

        alert("登录成功")
    };

    ak.onmessage = function (message) {

        console.log(message.data);

        var msg = JSON.parse(message.data);


         //创建一个标签
        var p = document.createElement('p');

        p.innerText = msg.from_user + ":"+msg.msg;

        document.getElementById('data_id').appendChild(p);

    };

    }

    function send_func() {

        var msg = document.getElementById('send_id').value;
        var arther = document.getElementById('arther_id').value;
        msg_dic = {

            'arther': arther,
            'msg':msg
        };

        ak.send(JSON.stringify(msg_dic));

        var p = document.createElement('p');
        p.innerText = msg + ':我';
        document.getElementById("data_id").appendChild(p);
    }


</script>
</html>