黑马程序员技术交流社区

标题: 【郑州校区】乐淘项目day2 [打印本页]

---

作者: 我是楠楠    时间: 2020-3-31 10:27
标题: 【郑州校区】乐淘项目day2

【郑州校区】乐淘项目day2

1.实现mui区域滚动：
    A.编写区域滚动需要的dom结构：
   

[AppleScript] 纯文本查看 复制代码

<div class="mui-scroll-wrapper">



        <div class="mui-scroll">



            <!--这里放置真实显示的DOM内容-->



        </div>



    </div>

    B.编写实现区域滚动的js代码：
   

[AppleScript] 纯文本查看 复制代码

<script>



        mui('.mui-scroll-wrapper').scroll({



            deceleration: 0.0005 //系数越大，滚动速度越慢，滚动距离越小，默认值0.0006



        });



    </script>

2.将数据添加到数据库中的步骤：
    A.点击wamp图标，点击phpMyAdmin
    B.输入账号root，默认密码为空
    C.点击导入选项卡，点击选择文件，选择项目中的“letao初始化.sql”
    D.点击页面下方的执行按钮，进行执行。


3.发送Ajax请求数据之后需要将数据在页面中显示，使用模板引擎展示数据的步骤：
    A.引入模板引擎:<script src="template-native.js"></script>
    B.创建模板script：<script type="text/template" id="first"></script>
    C.将数据和模板结合生成需要的html代码：
   

[AppleScript] 纯文本查看 复制代码

<script type="text/javascript">



        $.ajax({



            ...



            success:function(data){



                //html变量得到的就是模板引擎生成的html代码



                var html = template("first",data);



            }



        })



    </script>

    D.修改第二步步骤创建的模板，将数据填入到需要的地方
   

[AppleScript] 纯文本查看 复制代码

<script type="text/template" id="first">



        <% for(var i=0;i<rows.length;i++){ %>



            <div><%=rows.xxx%></div>



        <% } %>



    </script>

4.本地存储的基本使用：
    A.读取：var result = localStorage.getItem("存储信息的key");
    B.存储：localStorage.setItem("存储信息的key","需要保存的字符串信息");


案例：假设我需要将我的银行卡号存储在本地存储中，假定存储的关键字为cardId，那么代码编写如下：
    localStorage.setItem("cardId","13294632875327498321");
   
      如果需要从本地存储中读取卡号信息，代码编写如下：
    var card =  localStorage.getItem(cardId");

---

欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/)

黑马程序员IT技术论坛 X3.2