01-PHP-BASE
<?php
// 1.JS中有两种注释
// 1.1单行注释
// 1.2多行注释
//
/* */
// 2.JS中如何定义变量?
//var num = 10;
//$num = 10;
// 3.JS中如何打印内容?
//console.log();
// 注意点: 后端编写的代码不能直接运行, 只能放到服务器对应的文件夹下, 通过服务器运行
// 如何通过服务器运行: 通过ip地址找到服务器对应的文件夹, 然后再找到对应的文件运行
//echo $num;
// 4.JS中如何定义集合
// 4.1数组
// 4.2字典(对象)
//var arr = [1, 3, 5];
// arr[0];
//$arr = array(1, 3, 5);
//print_r($arr);
//echo "<br>";
//echo $arr[1];
//var dict = {"name":"lnj", "age":"33"};
// dict["name"];
//$dict = array("name"=>"lnj", "age"=>"33");
//print_r($dict);
//echo "<br>";
//echo $dict["name"];
// 5.JS中的分支循环语句
// if/switch/三目/for/while
//$age = 16;
//if($age >= 18){
// echo "成年人";
//}else{
// echo "未成年人";
//}
//$res = ($age >= 18) ? "成年人" : "未成年人";
//echo $res;
//switch ($age){
// case -1:
// echo "非人类";
// break;
// case 18:
// echo "成年人";
// break;
// default:
// echo "未成年人";
// break;
//}
$arr = array(1, 3, 5);
//for($i = 0; $i < count($arr); $i++){
// echo $arr[$i];
// echo "<br>";
//}
$index = 0;
while ($index < count($arr)){
echo $arr[$index];
echo "<br>";
$index++;
}
?>
02-get
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>02-get</title>
</head>
<body>
<!--
1.可以通过form标签的method属性指定发送请求的类型
2.如果是get请求会将提交的数据拼接到URL后面
?userName=lnj&userPwd=123456
3.如果是post请求会将提交的数据放到请求头中
4.GET请求和POST请求的异同
4.1相同点:
都是将数据提交到远程服务器
4.2不同点:
4.2.1提交数据存储的位置不同
GET请求会将数据放到URL后面
POST请求会将数据放到请求头中
4.2.2提交数据大小限制不同
GET请求对数据有大小限制
POST请求对数据没有大小限制
5.GET/POST请求应用场景
GET请求用于提交非敏感数据和小数据
POST请求用于提交敏感数据和大数据
-->
<form action="02-get-post.php" method="post">
<input type="text" name="userName"><br>
<input type="password" name="userPwd"><br>
<input type="submit" value="提交"><br>
</form>
</body>
</html>
<?php
//print_r($_GET);
//echo $_GET["userName"];
//echo $_GET["userPwd"];
//print_r($_POST);
//echo $_POST["userName"];
//echo $_POST["userPwd"];
?>
03-post-file
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>03-post-file</title>
</head>
<body>
<!--
注意:
1.上传文件一般使用POST提交
2.上传文件必须设置enctype="multipart/form-data"
3.上传的文件在PHP中可以通过$_FILES获取
4.PHP中文件默认会上传到一个临时目录, 接收完毕之后会自动删除
-->
<!--
默认情况下服务器对上传文件的大小是有限制的, 如果想修改上传文件的限制可以修改php.ini文件
file_uploads = On ; 是否允许上传文件 On/Off 默认是On
upload_max_filesize = 2048M ; 上传文件的最大限制
post_max_size = 2048M ; 通过Post提交的最多数据
max_execution_time = 30000 ; 脚本最长的执行时间 单位为秒
max_input_time = 30000 ; 接收提交的数据的时间限制 单位为秒
memory_limit = 2048M ; 最大的内存消耗
-->
<form action="03-post-file.php" method="post" enctype="multipart/form-data">
<input type="file" name="upFile"><br>
<input type="submit" value="上传"><br>
</form>
</body>
</html>
<?php
//echo "post page";
//print_r($_POST);
//echo "<br>";
//print_r($_FILES);
// 1.获取上传文件对应的字典
$fileInfo = $_FILES["upFile"];
//print_r($fileInfo);
// 2.获取上传文件的名称
$fileName = $fileInfo["name"];
// 3.获取上传文件保存的临时路径
$filePath = $fileInfo["tmp_name"];
//echo $fileName;
//echo "<br>";
//echo $filePath;
// 4.移动文件
move_uploaded_file($filePath, "./source/".$fileName);
?>
04-ajax-get
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>04-ajax-get</title>
<!--
1.什么是Ajax?
AJAX 是与服务器交换数据并更新部分网页的艺术,在不重新加载整个页面的情况下。
-->
<script>
window.onload = function (ev) {
var oBtn = document.querySelector("button");
oBtn.onclick = function (ev1) {
// 1.创建一个异步对象
var xmlhttp=new XMLHttpRequest();
// 2.设置请求方式和请求地址
/*
method:请求的类型;GET 或 POST
url:文件在服务器上的位置
async:true(异步)或 false(同步)
*/
xmlhttp.open("GET", "04-ajax-get.php", true);
// 3.发送请求
xmlhttp.send();
// 4.监听状态的变化
xmlhttp.onreadystatechange = function (ev2) {
/*
0: 请求未初始化
1: 服务器连接已建立
2: 请求已接收
3: 请求处理中
4: 请求已完成,且响应已就绪
*/
if(xmlhttp.readyState === 4){
// 判断是否请求成功
if(xmlhttp.status >= 200 && xmlhttp.status < 300 ||
xmlhttp.status === 304){
// 5.处理返回的结果
console.log("接收到服务器返回的数据");
}else{
console.log("没有接收到服务器返回的数据");
}
}
}
}
}
</script>
</head>
<body>
<button>发送请求</button>
</body>
</html>
<?php
//sleep(5);
//echo "ajax get page";
echo $_GET["userName"];
echo "<br>";
echo $_GET["userPwd"];
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>05-ajax-get</title>
<script>
window.onload = function (ev) {
var oBtn = document.querySelector("button");
oBtn.onclick = function (ev1) {
var xhr;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xhr=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xhr=new ActiveXObject("Microsoft.XMLHTTP");
}
// var xhr = new XMLHttpRequest();
/*
在IE浏览器中, 如果通过Ajax发送GET请求, 那么IE浏览器认为
同一个URL只有一个结果
05-ajax-get.txt === abc
console.log(Math.random());
console.log(new Date().getTime());
*/
xhr.open("GET","05-ajax-get.txt?t="+(new Date().getTime()),true);
xhr.send();
xhr.onreadystatechange = function (ev2) {
if(xhr.readyState === 4){
if(xhr.status >= 200 && xhr.status < 300 ||
xhr.status === 304){
// alert("请求成功");
alert(xhr.responseText);
}else{
alert("请求失败");
}
}
}
}
}
</script>
</head>
<body>
<button>发送请求</button>
</body>
</html>
abc def
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>06-ajax-get</title>
<script src="myAjax.js"></script>
<script>
window.onload = function (ev) {
var oBtn = document.querySelector("button");
var res = encodeURIComponent("wd=张三");
console.log(res);
oBtn.onclick = function (ev1) {
// %E5%BC%A0%E4%B8%89
// https://www.baidu.com/s?wd=%E5%BC%A0%E4%B8%89
// url?key=value&key=value;
ajax("04-ajax-get.php", {
"userName":"lnj",
"userPwd":"123456"
}, 3000
, function (xhr) {
alert(xhr.responseText);
}, function (xhr) {
alert("请求失败");
});
}
}
</script>
</head>
<body>
<button>发送请求</button>
</body>
</html>
05-用户注册ajax接口测试(使用后端人员提供的文档)
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>用户注册ajax接口测试</title>
<link rel="stylesheet" href="style/common.css">
<script src="myAjax.js"></script>
<script>
/* usage: 07-user.php?act=xxx&user=用户名&pass=密码
act:
add——注册用户
login——登陆
return: {error: 0, desc: 文字描述信息}
error:
0 成功
1 失败——具体原因参考desc
*/
window.onload = function(){
var oUser = document.getElementById("add_user");
var oPass = document.getElementById("add_pass");
var oBtn = document.getElementById("add_btn");
//注册
oBtn.onclick = function(){
var json = {
"act": "add",
"user":oUser.value,
"pass":oPass.value
};
ajax("07-user.php",json,function (xhr) {
alert(xhr.responseText);
}, function (xhr) {
alert("失败");
});
};
};
</script>
</head>
<body>
<!--登陆-->
<div class="loginBox">
<ul class="loginList clearfix">
<li class="hTxt">用户注册</li>
<li class="inputBox">
<input type="text" class="inputs" id="add_user">
</li>
<li class="inputBox">
<input type="password" class="inputs" id="add_pass">
</li>
<li class="btns">
<input id="add_btn" type="button" class="reg" value="" />
</li>
<li class="look"><a href="07-user_view.php" target="_blank">查看已注册用户</a></li>
</ul>
</div>
</body>
</html>
后端的文档
<?php
/*
**********************************************
usage: 07-user.php?act=xxx&user=用户名&pass=密码
act:
add——注册用户
login——登陆
return: {error: 0, desc: 文字描述信息}
error:
0 成功
1 失败——具体原因参考desc
**********************************************
*/
//创建数据库之类的
$db=@mysql_connect('localhost', 'root', '') or @mysql_connect('localhost', 'root', 'admin');
mysql_query("set names 'utf8'");
mysql_query('CREATE DATABASE it666_ajax');
mysql_select_db('it666_ajax');
$sql= <<< END
CREATE TABLE `it666_ajax`.`user` (
`ID` INT NOT NULL AUTO_INCREMENT PRIMARY KEY ,
`username` VARCHAR( 255 ) NOT NULL ,
`password` VARCHAR( 255 ) NOT NULL
) CHARACTER SET utf8 COLLATE utf8_general_ci
END;
mysql_query($sql);
//正式开始
//header('Content-type:zns/json');
$act=$_GET['act'];
$user=strtolower($_GET['user']);
$pass=$_GET['pass'];
switch($act)
{
case 'add':
$sql="SELECT COUNT(*) FROM user WHERE username='{$user}'";
$res=mysql_query($sql);
$row=mysql_fetch_array($res);
if((int)$row[0]>0)
{
echo '{error: 1, desc: "此用户名已被占用"}';
exit();
}
$sql="INSERT INTO user (ID,username,password) VALUES(0,'{$user}','{$pass}')";
mysql_query($sql);
echo '{error: 0, desc: "注册成功"}';
break;
case 'login':
$sql="SELECT COUNT(*) FROM user WHERE username='{$user}' AND password='{$pass}'";
$res=mysql_query($sql);
$row=mysql_fetch_array($res);
if((int)$row[0]>0)
{
echo '{error: 0, desc: "登陆成功"}';
exit();
}
else
{
echo '{error: 1, desc: "用户名或密码有误"}';
exit();
}
break;
}
?>