学习Ajax获得的知识点

首先PHP页面和HTML页面可以长得一模一样,唯一的区别就是必须放在服务器的文件夹底下。

php常用语法介绍

  • php标签
<?php 
这个一般叫作服务器端标记
?> 

正如JS需要放到script标签里面,php代码也需要放到php标记里面。这里面的内容都会被服务器解析为服务端代码。

<?php 
 echo  //这里的echo跟js中的alert有些类似,可以输出只不过alert会弹一个框出来
?>
  • 内容输出
  • Php中的echo会把内容输出到html代码里面
<?php 
 echo   ‘aaa’;//就会在页面输出aaa,,并且看不到php标记。只能看到结果中的内容。
?>
  • echo 'string';
    单引号的内容会被解析成字符串
  • echo "$"
    双引号中如果是字符串,则与单引号没差别;
    如果是变量,则会输出变量的值;
  • print_r():函数输出复杂数据类型,比如数组,对象
  • var_dump():函数输出详细信息,如对象、数组
$arr =array(1,2,'123');
echo'123';
//结果为123
print_r($arr);
//结果为Array ( [0] => 1 [1] => 2 [2] => 123 )
var_dump($arr);
/*结果为
array
0 => int 1
1 => int 2
2 => string '123'
 (length=3)
  • 变量声明
    与JavaScript不同之处在于它声明变量之前必须加$符号.
    $是php中变量的标志
  • $符号开头,其后是变量的名称
  • 变量名称必须以字母或下划线开头,不能以数字开头
  • 变量名称只能包含字母数字字符和下划线(A-z、0-9 以及_)
  • 变量名称对大小写敏感
  • Php中的变量不需要定义就可以直接使用
<?php 
$a= 12;
echo  $a;   //12;
?>

如果变量不带$直接echo ,会自动解析成字符串。
换句话说,php里面可以不加单引号直接加字符串。(但是不推荐这么写)

<?php 
echo abc;  //abc;
?> 
  • 字符串拼接
    Php中的字符串拼接:需要用到 “.” 而JS是用 “+”
    当时产生了疑问,那么JS中的 “.”php需要用什么符号? 这里就需要用“->”

  • 函数:
    PHP虽然系统内建了一些函数,但是这不影响我们定义自己的函数,函数的作用就是在代码中可以重复使用的语法块页面加载的时候不会执行只有在被调用的时候才会执行

  • 基础语法

function functionName() {
            这里写代码
}
function sayhi(){
    echo "Hello World";//无参数 无返回值的函数
}
function sayName($name){
    echo $name.'hello';//有参数 无返回值的函数
}
//调用
sayName('fox');     //foxhello
function sayFood($food='
flower'){
    echo $food;  //参数有默认值的函数
}
sayFood();         //flower
sayFood(‘water’);    //water
function sum($a,$b){
    return $a+$b; //有返回值的函数
}
sum(1,2);   // 3
  • 定义最基础的类
class  fox{
        public $name = 'jack';
        public $age = 10;
}
$fox = new $fox;
$name = $fox->name;      //对象属性取值,并保存在$name中
$fox->name = '小狐狸';    //对象属性赋值,对象name属性赋值为‘小狐狸’
  • 带构造函数的对象
class fox{
    //属性,外部无法访问
    var $name = 'foxes';
    public $age = 18;
    //定义方法 用来获取属性
    function Name(){
    return $this->name;
    }
  • 构造函数可以传入参数
function fox($name){
    $this->name = $name
}
    //定义了构造函数 需要使用构造函数初始化对象
    $fox = new fox('小狐狸
');
    //调用对象方法,获取对象名
$foxName = $fox->Name();  //小狐狸
  • header()函数
//用来向客户端(浏览器)发送报头,如果出现中文无法显示,可以在PH代码顶部添加如下代码
header("content-type:text/html; charset=utf-8");

静态页面和动态页面

现在有些做产品的或者做设计的这些不太懂程序的人会把静态和动态页面搞混掉,有很多人认为,只要是网页会动它就是动态页面,比如一个轮播图在那边滑来滑去会动,那就是动态网页,其他那最多算一个动画效果。

  • 静态页面
    没有后台。写完HTML什么样子。用户看到就是什么样子。
  • 动态页面:
    有后台 需要先经过服务器处理,然后发送给用户.

PHP表单

为了实现动态页面,我们就需要一些表单提交,从后台获得一些数据改变我们的页面。

  • PHP_GET 数据获取
    :在PHP中,如果想要获取通过get方法提交的数据,可以通过$_GET对象来获取(但是参数在地址栏中可以查看)
//下面就是一个简单的表单代码,将数据提交到01.php,使用get的方式
<form action="01.php" method="get" >

  <label for="">姓名:

      <input type="text" name= "userName"></label>
      <br/>

  <label for="">邮箱:

      <input type="text" name= "userEmail"></label>
      <br/>

      <input type="submit" name="">
</form>
<?php 
    echo 'userName:'.$_GET['userName'];
    echo '<br/>';
    echo 'userEmail:'.$_GET['userEmail'];
    //以上代码会返回对应表单name中输入的内容
 ?>
  • PHP_POST数据获取
    :在PHP中,如果想要获取通过post方法提交的数据,可以通过$_POST对象来获取
//下面就是一个简单的表单代码,将数据提交到02.php,使用post的方式
//(注意:代码中的method改为post)
<form action="02.php" method="post" >

  <label for="">姓名:

      <input type="text" name= "userName"></label>
      <br/>

  <label for="">邮箱:

      <input type="text" name= "userEmail"></label>
      <br/>

      <input type="submit" name=""></form>
<?php 
    echo 'userName:'.$_POST['userName']; 
    echo '<br/>';
    echo 'userEmail:'.$_POST['userEmail'];      
    //以上代码会返回对应表单name中输入的内容
 ?>

AJAX

介绍完PHP的一些内容,看起来似乎都很零散,但是结合接下来学习的Ajax就会有一个系统的认识了。

单词解释:
       Asynchronous Javascript And XML(异步JavaScript和XML),他并不是凭空出现的新技术,而是对于现有技术的结合:核心是js对象XMLHttpRequest
XMLHttpRequest

ajax使用的依旧是HTTP请求,那么一个完整的HTTP请求需要什么

  1. 请求的网址,方法get/post
  2. 提交请求内容数据,请求主体等
  3. 接收响应回来的内容
  • 五步使用法
    1. 建立XMLHTTPRequest对象

    2. 注册回调函数

      • 当服务器回应我们了,我们想要执行什么逻辑
    3. 使用open方法

      • 设置和服务器端交互的基本信息
      • 设置提交的网址,数据,post提交的一些额外内容
    4. 设置发送的数据,开始和服务器端交互

      • 发送数据
    5. 更新界面

      • 在注册的回调函数中,获取返回的数据,更新界面

示例代码:GET

<script type="text/javascript"> 
// 创建XMLHttpRequest 对象 
var xml = new XMLHttpRequest(); 

// 设置跟服务端交互的信息 
xml.open('get','01.ajax.php?name=fox'); //get的数据,直接在请求的url中添加即可
xml.send(null); // get请求这里写null即可 

// 接收服务器反馈 
xhr.onreadystatechange = function () {
 // 这步为判断服务器是否正确响应
 if (xhr.readyState == 4 && xhr.status == 200) {       
       alert(xml.responseText); // 打印响应内容  }
 };
</script>

示例代码:POST

<script type="text/javascript"> 
// 异步对象 
var xhr = new XMLHttpRequest(); 
// 设置属性 
xhr.open('post', '02.post.php' ); 
// 如果想要使用post提交数据,必须添加 

xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded"); 
// 将数据通过send方法传递 

xhr.send('name=fox&age=18'); 
// 发送并接受返回值 

xhr.onreadystatechange = function () { 
// 这步为判断服务器是否正确响应
if (xhr.readyState == 4 && xhr.status == 200) { 
alert(xhr.responseText); }
 };
</script>

考虑兼容性创建Ajax对象

var request ; 
if(XMLHttpRequest){ 
// 新式浏览器写法 
request = new XMLHttpRequest(); 
}else{ 
//IE5,IE6写法 
new ActiveXObject("Microsoft.XMLHTTP");
}

Ajax注意事项

  • POST请求注意点
    如果想要像form表单提交数据那样使用POST请求,需要使用XMLHttpRequest对象的setRequestHeader()方法 来添加 HTTP 头。然后在 send() 方法中添加想要发送的数据:
xmlhttp.open("POST","ajax_test.php",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send("fname=Bill&lname=Gates");
  1. onreadystatechange
  • 每当readyState改变时,就会调用该函数。

  • readyState
    存有 XMLHttpRequest 的状态
    从 0 到 4 发生变化。
    0: 请求未初始化
    1: 服务器连接已建立
    2: 请求已接收
    3: 请求处理中
    4: 请求已完成,且响应已就绪

  • status
    200: "OK"
    404: 未找到页面
    所以得当ready为4,status=200时,才表示找到页面,并且已经读取完毕时,调用onreadystatechange函数来执行我们想要的逻辑。

  • 服务器响应内容

    • 如果响应的是普通字符串,使用responseText
    • 如果响应的是XML,使用responseXML
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 206,378评论 6 481
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 88,356评论 2 382
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 152,702评论 0 342
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 55,259评论 1 279
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 64,263评论 5 371
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 49,036评论 1 285
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,349评论 3 400
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,979评论 0 259
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 43,469评论 1 300
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,938评论 2 323
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,059评论 1 333
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,703评论 4 323
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,257评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,262评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,485评论 1 262
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,501评论 2 354
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,792评论 2 345

推荐阅读更多精彩内容