什么是dom

js以事件驱动为核心的语言
dom:文档对象模型

dom操作三要素

  • 1.事件源
  • 2.事件
  • 3.事件驱动程序

dom操作三部曲

1
2
3
获取事件源
绑定事件
书写事件驱动程序

vue,react,angular对比

如何做技术选型
1.开源项目社区
2.开源框架做对比

vue.js更容易上手,学习曲线平稳
angular采用了后端的思想

vue.js思想

vue,react,angular都是MVVM
数据驱动+组件化的开发思想
vue,react,angular的联系

vue.js和angular的指令
react.js的组件化思想

vue-devtools

vue-devtools

在github下载:

1
git clone  https://github.com/vuejs/vue-devtools

用你的npm中进入该文件夹下

1
2
npm i  //添加依赖
npm run build //没有执行,文件夹shells>chrome>src文件夹

修改shells>chrome>mainifest.json

1
2
3
4
5
6
"background": {
"scripts": [
"build/background.js"
],
"persistent": true
}

谷歌浏览器的扩展程序功能

1
2
加载已解压的扩展程序,选择将文件夹中shells>chorme,
勾选开发者模式,

优缺点

1
2
缺点: 第二步执行起来很慢
优点: 有利于组件化开发

hexo博客的搭建

1.windows下安装git和node.js

  • git官网下载,安装.

  • node.js官网下载,安装.

2.安装hexo

  • 1.安装hexo依赖

    1
    npm install -g hexo
  • 2.初始化hexo,建一个文件夹MyBloc,然后进入文件夹,执行

    1
    hexo init
  • 3.生成静态文件

    1
    hexo generate
  • 4.启动服务

    1
    hexo s(hexo server)|hexo s -p 5000(端口号,4000被占用时)
  • 5.访问网址为: http://localhost:4000/

3.创建GitHub博客仓库

  • 1.首先新建一个仓库 new repository
1
注意: username.github.io,username替换为你自己账号的名字
  • 2.填写信息

    1
    2
    3
    username.github.io
    public
    Initialize this repository with a README选择
  • 3.查看是否存在秘钥(git bash here)

1
2
3
cd ~/.ssh
ls
id_rsa id_rsa.pub known_hosts
  • 4.如果没有秘钥,换成你自己的邮箱地址

    1
    ssh-keygen -t rsa -C "your email"
  • 5拷贝id_rsa.pub文件里的内容,添加到你的GitHub上(如何没有秘钥,是无法通过网络访问的)
    ssh and GPG keys

    1
    2
    title(名字任意)
    id_rsa.pub(拷贝里面的内容)

4.hexo博客和GitHub仓库相关联,并部署

  • 1.根目录下的_config.yml文件,然后添加入下内容,将username改为你自己的账号名

    1
    2
    3
    4
    deploy:
    type: git
    repo: git@github.com:username/username.github.io
    branch: master
  • 2.安装自动发布工具

    1
    npm install hexo-deployer-git  --save //会自动发布到本地服务器只需要刷新即可
  • 3.然后部署到GitHub

    1
    2
    3
    hexo clean //清理
    hexo generate //生成静态文件
    hexo deploy //部署网站

5.hexo常用的一些命令

1
2
3
4
hexo clean //清除
hexo g //上传到本地
hexo d //上传到github
hexo s //运行本地服务器