[前端学习]AJAX部分学习笔记,第一天

AJAX

  • ajax全程是Asynchronous Javascript and Xml(异步Javascript和Xml),也叫异步加载
  • 它的作用是让前后端技术能够混合交互,是前端加载数据时不需要重载页面,增强用户体验,更有桌面程序的感觉
  • ajax能够实现的功能:
    • 显示新的html内容而不用完全加载页面
    • 提交表单立即显示结果
    • 登录不用跳转页面
    • 星级评语组件
    • 遍历数据库数据显示,不用重载页面
    • 等等

ajax涉及技术

  • 服务器与客户端
    • 本质上都是智能计算机(手机、pad、智能家电也算是)不过配置和系统不同,服务器就是存储网页资源的东西,你浏览的任何网页上的内容都是客户端像服务器发送请求,然后服务器返回的。在调试工具中的network选项中可以查看页面的所有资源文件
    • 它们大致都可以分为硬件、系统、软件。不过客户端的软件多是个人使用的,而服务端软件多是提供互联网服务的
  • 网络相关概念
    • ip地址,网络通信的唯一标识,相当于是你使用设备的身份证。但是IP地址可能会随机改变,不多做深入
    • 域名,因为IP地址是一串数字,所以为了方便记忆就有了域名,域名实际就是绑定到对应的ip,通过访问域名就能访问对应的ip
    • DNS,用来维护域名与ip地址间的绑定关系。访问域名查询到对应的ip就是它来实现。它默认会先从本机的host文件中查找绑定关系,没有再从网络中找对应绑定关系
    • 端口。ip能确定找到某一台计算机,但是却没办法找到那台计算机上某一个应用程序,端口就可以帮助计算机找到另一台计算机上的某个应用程序。计算机最多支持65536个端口,但是前1024个端口是系统使用的
  • 通信协议
    • 计算机与计算机之前进行数据交互,需要通信协议。协议里包含很多了信息,比如域名、ip、设备信息、等等,不多做介绍。前端常用的就是http协议,也叫作超文本传输协议。请求和发送超文本文件

网站的定义

  • 网站就是由一系列的页面来组成
  • 静态网站
    • 静态网站就是将提前写好或者准备好的静态资源都放在服务器上,访问时将服务器端的资源加载到本机上进行查看
    • 存在的缺点:
      • 随着网站规模的逐渐扩大,可维护性越来越低
      • 没有交互性,只能看不能操作
  • 动态网站
    • 动态网站就是指html页面是动态生成的,当然这里指的动态生成不一定是全部页面,可能是页面的部分内容或者某些数据。通过动态的方式就能弥补静态网站的缺点

实现动态网站的技术

  • 动态网站一般都是通过后端语言来配合实现的。比如:php、java、.net、python、node.js等等,根据实际需求来选择即可

PHP基础语法

初始语法

  • 首先php代码必须包裹在<?php ?>
  • 讲内容输出到页面使用echo,类似于js的document.write()
  • js中字符串拼接使用+,而PHP中字符串拼接使用.
  • php中如果单引号包裹了变量,那么直接会将变量当作字符串输出。但是如果双引号包裹了变量,那么会解析变量输出值
题外话:
  • 在js中单双引号基本没有区别,唯独json字符串有。json字符串格式var json = '{"username":"zs"}';,可以看到json字符串外部用单引号,内部键值对用双引号。将json字符串转换为json对象需要使用JSON.parse()方法
  • 当然这只是引出的js知识点,与php无关

变量声明

  • 变量声明使用$符,命名规则与js一样,字符数字下划线组成且不能以数字开头,变量名对大小写敏感

内容输出

  • echo打印简单数据,比如字符串数值等
  • print_r()打印复杂数据结构,比如数组
  • var_dump()打印详细的复杂数据信息,比如数组、对象等,它不仅会打印数据结构,还会打印数据值类型和长度等详细信息

数组

  • $arr = array(1,2,3,4,5);声明数组赋值,默认是数字索引从0开始
  • $arr = array("one" => '一', "two" => "二")也是声明数组赋值,但是使用字符串索引来替代数字索引。这里就与js有区别了,js数组没有字符串索引,如果写了实际上是变成了对象形式的属性和属性值
  • 访问单个数组值$arr[0]或者$arr['one'],访问方法和js一样
  • 另外php中,数字索引和字符串索引不冲突。比如数组中的值,有几个有字符串索引,有一个只有值没写字符串索引。那么它默认会给该值加上数字索引,依然是从0开始
  • js和php同为弱类型语言,所以对数组值的类型没有限制,但一般很少放复杂数据类型
  • php中获取数组的长度使用count()方法,它内置了foreach方法来遍历数组,功能等同于jq中的each方法

数据类型

  • php的数据类型有整型、浮点型、字符串、布尔、数组、对象、空,基本差不多。浮点型就是小数点。使用gettype()方法可以获取变量的类型

函数

  • 几乎与js一样,有自定义函数和内置函数。也有预解析,但是php中函数名不区分大小写,js区分

HTTP常用的请求方式

  • get从服务器获取数据
  • post往服务器添加数据
  • put修改或者更新服务器的数据
  • delete删除服务器数据

前端常用的PHP预定义全局变量

  • $_GET['参数名']获取到对应参数的值
  • $_POST['参数名']与get功能一样
  • get和post两种传输数据的方式不一样,get方式传输的数据会作为url地址的参数,以?连接;而post请求方式数据会放在http头部中传输,并且传输数据大小也比get多
  • 另外要注意表单传输数据,一般是name属性值作为参数名。如果不写传输方式,默认是get传输
  • 题外话:可以使用header('Content-type:xxx')方法设置服务器返回文件类型

后台接口

  • 通过后代语言,可以返回完整动态页面,也可以返回一组数据
  • 返回完整动态页面,在以前用得比较多。这种技术也叫做服务器端渲染技术
  • 现在用得最多的还是通过后端语言根据前端发送的值查询数据库,并返回一组对应的数据
  • 数据类型有很多(比如:数值、字符串、html结构,json数据都有可能,根据你业务需求来定。注意:不管什么类型数据浏览器接受到后都是作为字符串处理),用得最多的还是返回json数据,前端使用ajax来配合解析获取
  • 后台接口就是API的一种

后台请求流程

  • 实际上apache服务器(其他服务器也是)没有任何解析功能,静态页面是直接返回资源文件,直接由前端浏览器来渲染。而后端语言是由内置在服务器中的语言模块,渲染完毕后再由服务器返回给前端
  • 所以可以这样理解,后端语言动态文件都是在服务器端由服务器调用模块直接渲染完毕。跟前端没有关系,前端只是负责接受数据
  • 前端和后端渲染的对象是不同的

前后端的分工

  • 笼统的说就是:前端负责实现页面样式结构特效等,而具体的数据则由后代进行动态的填充
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 134,933评论 18 139
  • 两周一本 2月5日—6月25日 当我遇见一个人 这样装修不后悔 筑巢记 家居配色指南 小家,越住越大 接纳孩子 游...
    多美麻麻阅读 219评论 0 1
  • 有时候50后、60后、70后老板对人员忠诚度的要求,是和现在的80后、90后的追求有很大差异的。 比如,公司要招聘...
    山水千万重阅读 1,836评论 0 0