795
实现一个购物网站的首页的js代码
- 使用text 和 css 可以解析 html 内容和 css 内容
- 语法是 text! + 路径 这个导出是 xxx.html 文件的内容
- $css! + 路径 ， 这个不需要导出，自动会渲染到当前引入的当前页面中 ``` difine(['swiper','template','flyer'],function(swiper,template,flyer){最外层})
仿写：在实际工作中有待考虑
define(['text!./home.html','$css!./home.css'],function(html){下一层 })
# function request () {第二层 }
## $.ajax({ 第三层 }) 这里可以写好备注 ： xxx数据
### 第三层：
* type:"get",
* url:"https://xxx.xxx.xxxx/xxx/xx.php",
* success : function(data){ }
#### 第四层：
* var result = JSON.parse(data);
* var slide = result.data.slide;
* var html = '';
* for(var i = 0;i < slide.length;i++){ 第五层 }
* $('#banner').html(html);
* swiperFn();
##### 第五层：
html +='<div ><img src="'+slide[i].activity.img+'" /></div>
******
之后又回到第二层写新的数据，在第四层和第五层进行修改。
#### 第四层修改部分
* var menu = result.data.menu;
* var html = '';
* for(var i in menu){第五层}
* $('.menu ul').html(html);
##### 第五层写法：为了展现"<"故意去掉
* var activity = menu[i].activity;
* html +='li>'+
* 'img src="'+activity.img+'" />'+
* 'p>'+activity.name+'/p>'+
* '/li';
## 心得体会：
描述清楚每一层要做什么！其实也是理清思路的过程，这里面有用到像ajax
get 请求 访问一个php文件。
在下面写函数 可以通过json文件请求。并且运用了指针指向 运用了堆和栈的关系。
单双引号问题，做了一个拼接。
把空字符串赋值给变量。
在做首页的时候：我会考虑几点：
1. 轮播图数据
2. 菜单数据
3. 热卖数据
4. 疯狂秒杀
5. 疯狂秒杀数据
6. 疯狂秒杀倒计时
7. 疯狂秒杀即将开抢判断
8. 搜索页面
9. 扫一扫页面
10. 获取本地购物车存储的数据
11. 购物车数量增加
12. 点击“加号”时实现动画效果
13. 封装一个购物车数量总量的函数
14. 封装一个数量变化特别大的函数
整合起来。前期回顾：
function request(){...}
## 封装一个数量变化字体变大的函数（第一层）
function request(){...}
function Big(){...};
function swiperFn(){...}
return {"request":request...}
### 封装一个数量变化特别大的函数展开式
funtion Big() {
* $('.circle').addClass('span_active');
* setTimeout(function(){...},1000)};
* $('.circle').removeClass('span_active')
function swiperFn(){
* var mySwiper = new Swiper('.swiper-container',{...});
* loop : true,
* autoplay: 2000,
* autoplayDisableOnInteraction : false,
* pagination: '.swiper-pagination'
}
return {"request" : request}
});
最后更新：2017-04-07 21:23:50