前端网络交互的两种技术方案

form表单提交、以及后来的ajax异步交互

form与ajax的对比

1. ‌form必须有提交按钮，ajax只要在javascript中可以随意发起

2. ‌form只能提交数据，不能接收数据，ajax都可以

3. ‌form会跳转到url界面，ajax不会(也可以利用BOM api跳转)

form/ajax的应用：

• 可以用在前端与后台服务器交互中，常用来给服务器发送、请求数据

• 也可以在前端的html之间，用来跨文件传值(需要将被传值文件改为.php，使用的时候也是用PHP代码来取用)

前端中发送请求的三种形式

• 地址栏输入URL，访问 form表单，发送请求(上面两种方式，都会刷新界面)

  form表单，是用来搜集用户数据的，所以不做接受数据：刷新界面、同步、发送数据(得有提交按钮)

  设置action = URL、method = GET/POST(默认是GET)，有三种形式：

  • method = GET
  • method = POST
  • POST上传文件：(在当前界面上传完成之后，才跳转)

  <!-- 
  上传文件必须设置 enctype ='multipart/form-data'
  语法：
  -->
  <form action="file.php" method="post" enctype ='multipart/form-data'>
  

• ajax发送请求

  • 同iOS里的网络数据请求：不刷新界面、异步、发送、接受数据
  • 写法,是通过浏览器端的js,帮我们预定义的一个 异步对象 — XMLHttpRequest 来完成的

• 请求数据结果：

  • 如果请求的是HTML文件：原封不动返回，服务器不会动这个HTML文件
  • 如果请求的是PHP文件：
    • HTML部分的代码，原封不动的返回
    • <?php ?>里的PHP代码，在服务器端执行，只返回输出函数：echo、print_f 打印的结果