关于HTML一周学习的总结

学习动机:基于前一段时间的公司需求需要与合作公司对接js,添加广告,懂js得老程序员的奶爸请假,我们移动端的对接之路显得尤为漫长,对有时候发生的问题甚至不知道是哪一端的问题,然后就对bug踢皮球。因此埋下学html的根,然后一自学达人给我定下一系列的任务,为了不能打自己的脸加上不能让人家的任务白写了,于是走上html的初试,以下是一周的经验和教训,回顾,记录和总结:

学习准备:1、安装html的编辑器,之前有下载看过sublime,也是很多老前端给我的推荐,毫不犹豫使用了介个;sublime官网

                  2、浏览器,开发必备的chrome,还有调试需要的safari

学习之路:

1、使用工具的熟悉过程

      1>、听说sublime的强大之处就在于插件的魅力,第一天使劲捣鼓package Control,关于插件有很多教程的推荐,随便搜,安装自己感兴趣的插件,每个人习惯不同,需求不同,各取所需。

      2>、弄清楚html的几个基础标签:

<head>刚开始理解仅为页面的标签标题显示,后面发现有很多写法会把本页面的一些基础样式和资源都写在这里
<body>是页面的最主要模块,编写页面所有样式,交互的模块,页面你所能看到的地方的代码一般是由该标签对包裹的
<br>html不会换行,该标签已加上去就是标志换行
<h>标题标签
<p>段落标签
<button>按钮以及点击事件的绑定,JavaScript的绑定

     3>、对于注释,在<script>标签对中可以识别//和/**/,否则只能识别<!--注释内容-->,刚刚开始以为是编辑器识别,对此很迷糊,原来sublime只是一个轻量级的文本编辑器,其实sublime只是对标签对识别,和Xcode不同,听说webStorm可以和Xcode比较,之前一直纳闷怎么以文件夹的形式看我的html文档,才知道直接把文件夹拖进去就好了,菜鸡菜鸡啊!

2、真正开始HTML学习 

     1、安装nodeJS环境,homebrew安装的 ,很简单   

brew install node
检查安装是否成功
1、brew list 看有米有node
2、node -v  /  npm -v
get到一个点,当发现有时候下载一个东西的时候,当指定source源失败,可以试试把源删除看看

nodeJs是JavaScript运行的环境,而npm其实是类似于Xcode的Pod,管理第三方,很多人封装好的js传到npm服务器,自己需要的就去下载使用,npm会把很多依赖关系自动下载好,省心效率赞

     2、使用nodejs初始化一个web服务,启动服务后,自己手机可以打开html(连上电脑的网)

1、https://www.jianshu.com/p/69e7f3734eb5  使用express-generator快速创建了web项目
  可以直接使用npm start直接启动工程--打开package.json会发现是 node .bin/www
   对于生成的一系列文件夹的作用:
   app.js:整个工程的配置文件,设置工程的中间件和路由设置
   bin:存放整个工程的可执行文件的目录,当收到请求,express自带的中间件static会把请求映射到public中,引用public的文件,而public中存放的文件就是我们些项目用文件夹
   bin/www文件:配置入口文件配置,配置了端口,引用app.js,并将事件转发给js
   public:项目编辑的文件夹,里面可以去指定不同分类下的文件
   (后期要学会,不同文件夹的下的调用,比如html文档调用js类的方法。等等)
   

   3、开始真正的js交互,js调用OC,OC调用js(自建ios demo,将自己的nodejs服务器开启,这是OC的内容)

       1>window.webkit.messageHandlers.OCselectorName.postMessage(paras);   (js调用OC的方法,保持方法名的一致)

       2>OC调用js的话就要在OC中写JS语句,这需要去学习js的语法

交互部分其实比较简单,对于理解了js的用法,可能会对这个流程的帮助很大。

后面的目标就是学会js的写法以及调用,关于css的用法,需要掌握引用,如何去使用,目前的界面允许写的丑一点,后面要改善哦!

               

猜你喜欢

转载自blog.csdn.net/weixin_41953322/article/details/80864232
今日推荐