Js中级--模拟短信发送

最新推荐文章于 2023-08-16 20:39:19 发布

Wendy-lxq

最新推荐文章于 2023-08-16 20:39:19 发布

阅读量2.2k

点赞数 2

分类专栏： JavaScript 文章标签： javascript

本文链接：https://blog.csdn.net/u010297791/article/details/53606125

版权

本文介绍了使用JavaScript模拟短信发送的功能，包括HTML结构设计、CSS样式美化及JS代码编写。重点在于如何通过修改innerHTML属性实现新消息在页面上的追加或前置，确保消息记录的正确显示。

摘要由CSDN通过智能技术生成

在学习的过程中，看到js学习的视频中在讲解模拟短信发送，所以自己也动手写了一下这段代码。

在写一个普通的功能时，首先需要设计页面，也就是html结构，然后用css样式修饰，使其界面更加美观。最后才是开始编写js代码，实现页面的交互。

界面设计如下：

html结构如下：

<div class="box">
    <div class="box-cont">
        <ul id="cont">
            <li class="fl">//为了先实现界面，所以事先写了对话内容
                <img class="" src="images/1.png">
                <p class="">你好！</p>
            </li>
            <li class="fr">
                <img class="" src="images/2.png">
                <p class="">你好！</p>