• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com专业计算机教程网站
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure
您的位置:首页 > 网页设计 >html5 > 百度音乐随身听PC端的前端技术?

百度音乐随身听PC端的前端技术?

作者:匿名 字体:[增加 减小] 来源:互联网 时间:2018-12-03

本文主要包含100等相关知识,匿名希望在学习及工作中可以帮助到您
百度音乐随心听
本人前端菜鸟,想100%模仿制作一个百度随身听的PC页面,但不知道该网站的团队运用了什么前端开发技术?
另外,也请前端前辈指导下如何下手?
非常感谢

回复内容:

既然楼上的高手不愿意写,那我就来献丑说一点

开工!

技术点1:浏览器的降级处理。
通过userAgent进行了判断,对支持localStorage本地存储与非IE内核浏览器加载localjs.js;否则直接加载jquery-1.7.2.js,如下图↓


作用:支持本地存储就通过localjs把jquery写入本地,下次再通过localjs读取jquery,就不需要用户再次请求jquery了。


技术点2:前端自动化工具,如下图↓

这些js创建时肯定不是这种命名方式的,读起来完全莫名其妙有木有,
(补充:这里应该是 摘要算法_百度百科 相关资料 前端工程与性能优化 · Issue #3 · fouber/blog · GitHub)
数据摘要算法是密码学算法中非常重要的一个分支,它通过对所有数据提取指纹信息以实现数据签名、数据完整性校验等功能,由于其不可逆性,有时候会被用做敏感信息的加密。
摘要结果(也就是文件名)会根据文件内容进行计算, 用于文件版本迭代,清理缓存。


技术点3:AMD 模块化加载 如下图↓ 我

用绿色框标注的data-requiremodule就是JS模块的依赖,
想要了解相关知识的话→ RequireJS 中文网。

但并不是整个网页都使用这种技术,页面注释也写到:
// HACK: muplayer通过全局变量而非AMD的方式初始化
muplayer用来初始化这个网站的播放器



------------------------------------完结--------------------------------------------

CSS就不多谈了,icon用css sprites整合了起来。
不知道题主所谓的技术菜是指CSS还是JS 还是都菜 = =
个人认为 技术点2、3就够折腾一阵子了,配置环境的痛苦..

btw:如果有用能否让我骗几个赞 QAQ 其实我也不太懂。我插个大蒜装逼一下。

模仿分为两种:

第一种是假模仿,就是把他的面子模仿的一模一样。也就是能以假乱真(哪怕是纯静态的)

第二种是实质的模仿,要做到这一点,可能有点难。

您可能想查找下面的文章:

相关文章

  • 2018-12-03用html5的canvas画布绘制贝塞尔曲线完整代码_html5教程技巧
  • 2018-12-03为何说 HTML5「no longer based on SGML」?
  • 2018-12-03分享HTML5中10个经典的动画工具
  • 2018-12-03为你的html5网页添加音效示例_html5教程技巧
  • 2018-12-03用localStorage实现记住密码的功能
  • 2018-12-03HTML5 canvas基本绘图之绘制阴影效果
  • 2018-12-03html5中设置或返回音频/视频是否默认静音的属性defaultMuted
  • 2018-12-03有关设计参考的文章推荐5篇
  • 2018-12-03想在猪八戒接做网页,要怎样系统的学习 ?
  • 2018-12-03H5移动端各种各样的列表的制作方法(一)

文章分类

  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure

最近更新的内容

    • html5使用canvas画一条线_html5教程技巧
    • 在ios端点击按钮闪烁解决方法
    • 基于第一个PhoneGap(cordova)的应用详解 _html5教程技巧
    • 实例教程 利用html5和css3打造一款创意404页面
    • html5利用canvas绘画二级树形结构图
    • H5最全面解读
    • html5的画布canvas——画出弧线、旋转的图形实例代码+效果图
    • H5开发视频遇到的问题及解决方案
    • 如果用html5来取代移动端的app,其所面临的问题有哪些?
    • 让web app更快的HTML5最佳实践

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有