一、資料庫基礎 1.1什麼是資料庫? 什麼是資料庫? 答:就是一個很大的一個文件,只不過這個文件可以通過一些‘命令’操作數據; 增、刪、改、查數據; 資料庫等於持久數據和數據操作的一個統稱。 資料庫是按照數據結構來組織、存儲及管理數據的倉庫。 資料庫有哪些? MySQL、SQL server、Ora ...
一、資料庫基礎
1.1什麼是資料庫?
什麼是資料庫?
答:就是一個很大的一個文件,只不過這個文件可以通過一些‘命令’操作數據;
增、刪、改、查數據;
資料庫等於持久數據和數據操作的一個統稱。
資料庫是按照數據結構來組織、存儲及管理數據的倉庫。
資料庫有哪些? MySQL、SQL server、Oracle 都是關係型數據管理系統(RDBMS)。
SQL存儲數據相對較小,最為常用的資料庫就是MySQL(開源、免費)
Orecal大型資料庫(不開源、收錢)
NOSQL
Mongodb
操作資料庫也有自己的語言,這個語言叫結構化查詢語言。結構化查詢語言(Structured Query Language)簡稱SQL。用於存取數據以及查詢、更新和管理關係資料庫系統;同時也是資料庫腳本文件的擴展名。
1.2 MySQL 的操作
因為安裝了PHPnow。所以每一個同學的電腦中都有資料庫。
想操作資料庫可以通過php操作,也可以通過可視化的資料庫管理軟體操作。
我們用的可視化的資料庫管理軟體是Sqlyog。
SQLyog 是一個快速而簡潔的圖形化管理MYSQL資料庫的工具,它能夠在任何地點有效地管理你的資料庫,由業界著名的Webyog公司出品。
資料庫的結構層次組成:資料庫 > 表 > 欄位(條目),每個資料庫的表中必須有一個主鍵。
|
1、連接資料庫,輸入用戶名和密碼 用戶的密碼就是你安裝PHPNOW的時候,也安裝mySQL,密碼123456 |
|
2、認識sqlYog的圖形界面 |
|
3、建立自己的資料庫 |
|
4、創建資料庫名字和設置字元集 |
|
5、點擊資料庫的“+”,你會發現資料庫當中有表,在資料庫中創建表。 |
|
6、需要設置表名字(gz0920);設置字元集(UTF8) 其餘的設置都為預設 |
|
給(gz0920)表添加欄位; 註意:①int代表的是整數 varchar字元串 ②一個表當中主鍵只能有一個非空自增 |
|
資料庫表的欄位 |
1.3 SQL語言操作資料庫
資料庫增刪改查操作(CRUD)
C 增加(create)
R 查找(read)
U 更改(update)
D 刪除(delete)
sql可以通過後臺語言(PHP、JSP、aps.net)執行操作資料庫。SQL 語句對大小寫不敏感
sql語句手冊:http://www.w3school.com.cn/sql/sql_and_or.asp
●查詢
SELECT 欄位 FROM 表名 |
SELECT * FROM banji0922 |
SELECT * FROM banji0922 WHERE sex="男" |
SELECT * FROM banji0922 WHERE xingbie = "男" AND nianling > 60 ; |
SELECT * FROM banji0922 WHERE xingbie = "男" ORDER BY nianling DESC; |
DESC是降序;ASC 是升序
SELECT 欄位 FROM 表名 SELECT xingming FROM gz1125 |
提示:查詢與語句SELECT * FROM gz1125 單詞一般都是大寫,後面添加的是表名稱,因為表中才有數據。
●增加
INSERT INTO語句插入條目:
INSERT INTO 表名稱 VALUES (值1, 值2,....) |
我們也可以指定所要插入數據的列:
INSERT INTO table_name (列1, 列2,...) VALUES (值1, 值2,....) |
INSERT INTO banji0922 VALUE(11,"王安石",99,"男","6543432534"); |
不想插入所有的條目,必須羅列響應的欄位:
INSERT INTO banji0922 (xingming,qqhao) VALUE ("李大釗","3465342"); |
下麵的是錯誤演示:
INSERT INTO banji0922 VALUE ("李大釗","3465342"); |
●更改
語法:
SET 表示設置
WHERE 表示條件
UPDATE 表名稱 SET 列名稱 = 新值 WHERE 列名稱 = 某值 |
更改多個條目,用逗號隔開:
UPDATE 表名稱 SET 列名稱 = 新值,列名稱 = 新值 WHERE 列名稱 = 某值 |
UPDATE banji0922 SET nianling = 200 WHERE xingming = "李大釗"; |
UPDATE banji0922 SET xingbie = "男" WHERE nianling > 20; |
●刪除
DELETE FROM 表名稱 WHERE 列名稱 = 值 DELETE FROM banji0922 WHERE xingming = "李大釗"; |
刪除整個表:
DELETE FROM banji0922; |
●WHERE條件
●備份資料庫
恢複數據:將我們生產的sql文件拖拽到資料庫中,點擊執行多條sql語句按鈕,再刷新資料庫列表。
SELECT * FROM banji0922 SELECT * FROM banji0922 WHERE xingbie = "女" INSERT INTO banji0922 ( xingming,nianling)VALUE ("王羲之",300) UPDATE banji0922 SET nianling = 30 WHERE xingming = "王羲之" DELETE FROM banji0922 WHERE xingming = "王羲之"; |
二、PHP操作資料庫
概述:對於後臺而已,經常做的一件事情就是保存數據,操作資料庫,PHP屬於後端語言,因此也有操作資料庫的方法。
<?php // 連接資料庫 參數 : 地址 、 用戶名 、 密碼 mysql_connect("localhost","root",123456); // 選擇操作哪個資料庫 mysql_select_db("student"); // 設置編碼 mysql_query("SET NAMES UTF8"); // 寫執行的sql語句,快捷鍵 ctrl+k+u $sql = "INSERT INTO banji0922 VALUE (13,'海子',20,'男','123465454')"; // 執行sql語句 mysql_query($sql); ?>
要從資料庫中所有的條目顯示到頁面上:
<meta charset="UTF-8" /> <?php // 連接資料庫 參數 : 地址 、 用戶名 、 密碼 mysql_connect("localhost","root",123456); // 選擇哪個資料庫 mysql_select_db("student"); // 識別中文字元 mysql_query("SET NAMES UTF8"); // 寫執行的sql語句 // 快捷鍵 ctrl+k+u $sql = "SELECT * FROM banji0922"; // 執行sql $result = mysql_query($sql); // 把$result類數組對象變成數組 $row = mysql_fetch_array($result); // 輸出 print_r($row); ?>
Array ( [0] => 1 [id] => 1 [1] => 諸葛亮 [xingming] => 諸葛亮 [2] => 80 [nianling] => 80 [3] => 男 [xingbie] => 男 [4] => 23456789 [qqhao] => 23456789 )
print_r後只顯示資料庫中第一條信息。
查詢資料庫:
<?php // 連接資料庫 參數 : 地址 、 用戶名 、 密碼 mysql_connect("localhost","root",123456); // 選擇哪個資料庫 mysql_select_db("student"); // 識別中文字元 mysql_query("SET NAMES UTF8"); // 寫執行的sql語句 // 快捷鍵 ctrl+k+u $sql = "SELECT * FROM banji0922"; // 執行sql $result = mysql_query($sql); // 把$result類數組對象變成數組 $row = mysql_fetch_array($result); // 輸出 print_r($row); // 把$result類數組對象變成數組 $row = mysql_fetch_array($result); // 輸出 print_r($row); …………………… ?>
<?php mysql_connect("localhost","root",123456); mysql_select_db("student"); mysql_query("SET NAMES UTF8"); //資料庫返回的數據(對象) $result = mysql_query("SELECT * FROM gz0920"); //將結果轉換為數組 while ($array = mysql_fetch_array($result)) { print_r($array["xingming"]); echo "<br/>"; } ?>
提示:
①資料庫返回的結果是一個對象,因此需要用mysql_fetch_array($result)變為數組;
②遍曆數據取到你想要的數據
三、複習
概述:對於客戶端而言,當在地址欄輸入網址回車的時候,會向伺服器發起一個上行請求(GET、POST),網頁中幾乎90%都是GET請求,登錄、註冊...可以用POST,它兩者不同的地址:
l GET請求是以偽裝URL的形式(?k=v&k=v)向伺服器傳遞一些額外數據;
l POST請求是以報文體的形式向伺服器傳遞數據
報文:報文頭(客戶端的瀏覽器的信息)+ 報文體(一般為空)
get:一般用於信息的獲取使用url傳遞參數。對所送的數據有位元組數限制。(本質上:以少換多)。Get請求是向伺服器獲取消息。
post:一般用於存儲或修改伺服器上的額資源的。對所發送的數據沒有位元組限制。Post請求所有都是通過form表單形式提交的。Post請求可以看成向伺服器推送消息。(信息量大,換回來的少)
一個完整的URL包括哪些部分:
http://www.baidu.com:8080/news/2017-12-09/index.php?newsid=344532&pagenum=12#name
l http:// 協議部分
l www.baidu.com 功能變數名稱
l :8080 埠
l /news/2017-12-09/ 虛擬目錄,從功能變數名稱的第一個“/”到最後一個“/”
l index.php 文件名
l ?newsid=344532&pagenum=12 參數部分 從?開始到“#”之前結束
l #name 從#開始到最後,hash
四、Ajax開發
4.1 Ajax介紹
Ajax 即“Asynchronous Javascript And XML”(非同步 JavaScript 和 XML),是指一種創建互動式網頁應用的網頁開發技術。
Ajax = 非同步 JavaScript 和 XML(標準通用標記語言的子集)。
Ajax 是一種用於創建快速動態網頁的技術。
Ajax 是一種在無需重新載入整個網頁的情況下,能夠更新部分網頁的技術。
通過在後臺與伺服器進行少量數據交換,Ajax 可以使網頁實現非同步更新。這意味著可以在不重新載入整個網頁的情況下,對網頁的某部分進行更新。
傳統的網頁(不使用 Ajax)如果需要更新內容,必須重載整個網頁頁面。
到底什麼是Ajax?
它不是一個技術(多門技術的集合),它可以“悄悄的”向伺服器請求數據,伺服器也可以“悄悄的”向客戶端響應返回數據,最終實現整個頁面沒有重新載入,而實現頁面中局部刷新數據。
2005 年初,許多事件使得 Ajax 被大眾所接受。Google 在它著名的交互應用程式中使用了非同步通訊,如Google、Google 地圖、Google搜索應用了Ajax技術。
4.2 Ajax效果
概述:對現在的開發人員而言,“遍地”都是Ajax
例如163郵箱的註冊,當你在郵箱地址文本輸入框當中輸入完手機號之後,客戶端會向伺服器“悄悄”的傳遞數據,伺服器也會‘悄悄的’響應,給你返回數據;整體的網頁沒有更新的情況下,實現局部刷新數據;例如微博的點贊等......
4.3 Asynchronous和synchronous
概述:耗時間相對長一些的語句,我們稱之為“非同步語句”:Ajax、setInterval()、setTimeout()、animate()、Nodejs都是非同步語句。非同步語句耗時都比較長,所以會先執行後面同步的語句(如果先執行非同步語句,程式就被阻塞了)。
經驗:只要有回調函數的都是非同步語句。
遇到非同步語句,會先放一邊,執行後面同步的語句,回頭再執行自己
var f = 0; setInterval(function(){ f++ console.log(f); },1000) console.log("哈哈");
同步語句一般耗時不長,依次從上往下的順序執行
for(var i = 0; i < 10; i++){ console.log(i) } console.log("哈哈");
4.4進程和線程
概述:什麼是進程,一個應用就是一個進程。
什麼是線程?線程就是進程的基本單位,也就說,進程是由多個線程組成的(主線程),JS是單線程。
4.5 jQuery的Ajax
jQuery的get請求語法:
$.get(url, [data], [callback], [type])
案例:當單擊按鈕的時候,將伺服器中的數據顯示到標簽中,並且不刷新頁面:
$("button").click(function(){ //發起一個GET請求 $.get("data/result.txt", function(data){ $("p").html(data) }) }); //用定時器證明這個頁面沒有重新載入 var i = 0; setInterval(function(){ i++; $("h1").html(i) },100)
註意:
所有的文件都必須在伺服器中。
必須是http請求過來的。
請求的頁面若不是通過http打開的,會報錯,這個報錯就是著名的跨域報錯。
jQuery中的$.get,幫我們做了什麼事情?
發送了http請求,請求介面中的數據。然後伺服器收到http請求,開始執行http響應,txt中的內容在http的報文體中攜帶到瀏覽器中。被$.get的回調函數接收。回調函數的data就是http響應的報文體中的參數。
4.5.1 Ajax實現註冊功能
註冊業務:客戶端會向伺服器傳遞一些數據,伺服器會保存這個數據,如果用戶名已經被註冊了,提示該用戶名已經被註冊。
註意:別忘記創建資料庫
前端html:
<body> <p>賬戶:<input type="text" id="user" /><b class="info"></b></p> <p>密碼:<input type="password" id="pwd" /></p> <button>註冊</button> </body> <script type="text/javascript" src="js/jquery-2.2.4.min.js"></script> <script type="text/javascript"> $("button").click(function(){ $.post("php/reg.php", { "name": $('#user').val(), "password": $('#pwd').val() }, function(data){ if(data == 1){ alert("註冊成功"); }else{ alert("註冊失敗"); } }) }); //文本框輸入內容時,實時查詢用戶名是否存在 $("#user").on('input',function(){ $.get("php/search.php?name=" + $(this).val(), function(data){ if(data == 1){ $('.info').css('color','green').html("恭喜你可以註冊"); }else{ $('.info').css('color','red').html("用戶名已被註冊"); } }) }) //失去焦點隱藏info $('#user').blur(function(){ $('.info').hide() }) </script>
reg.php註冊:
<?php //獲取前端傳過來的數據 $name = $_POST["name"]; $password = $_POST["password"]; //連接資料庫,參數:資料庫地址、用戶名、密碼 mysql_connect('localhost', 'root', '123456'); //選擇要操作的資料庫 mysql_select_db("student"); //設置編碼 mysql_query("SET NAMES utf8"); //寫執行插入的SQL語句,保存到資料庫的表中 $sql = "INSERT INTO stuuser (name, password) VALUES ('$name','$password')"; //執行SQL語句,會返回成功插入的結果(條數) $result = mysql_query($sql); if($result){ echo 1; //插入成功返回1給前端 }else{ echo 0; //插入失敗返回0給前端 } ?>
search.php查詢資料庫:
<?php //獲取前端傳過來的數據 $name = $_GET["name"]; //連接資料庫,參數:資料庫地址、用戶名、密碼 mysql_connect('localhost', 'root', '123456'); //選擇要操作的資料庫 mysql_select_db("student"); //設置編碼 mysql_query("SET NAMES utf8"); //寫執行插入的SQL語句,保存到資料庫的表中 $sql = "SELECT * FROM stuuser WHERE name='$name'"; //執行SQL語句,會返回成功查詢的結果 $result = mysql_query($sql); //查詢資料庫條目的個數,並返回 $count = mysql_num_rows($result); //給前端返回一個結果:能不能註冊 if($count == 0){ echo 1; //如果資料庫不存在,返回1給客戶端驗證 }else{ echo 0; } ?>
4.5.2 jQuery的get請求方法
語法:
$.get(url, [data], [callback], [type])
jQuery的get請求語法:有兩種方法傳遞數據,但最終參數都是以query string的方式傳遞給服務端
示例1: $.get("介面地址?k=v&k=v",function(data){ }); 示例2: $.get("介面地址",{k:v, k:v},function(data){ });
4.5.3jQuery的post請求方法
jQuery的 post請求的語法:參數依然是以報文體的形式傳遞到伺服器中
$.post(url, [data], [callback], [type])
4.5.4 $.ajax()方法
$.ajax()方法有以下常用參數:
url: 要求為string類型的參數,(預設為當前頁面地址)發送請求地址。
type:要求為string類型的參數,請求方式(get或post),預設為get。
data:要求為object或string類型的參數,發送到服務端的數據
success:請求成功的回調函數
dataType:伺服器返回數據的類型,例如:xml、string、html、json等
error:請求失敗後的回調函數
complete:請求成功或失敗的都會執行的回調函數
五、原生JavaScript的Ajax
5.1原生Ajax發起HTTP請求
XMLHttpRequest()對象手冊:
http://www.w3school.com.cn/xmldom/dom_http.asp
https://developer.mozilla.org/zh-CN/docs/Web/API/XMLHttpRequest
概述:原生Ajax要使用JavaScript的內置構造函數。
所有現代瀏覽器(IE7+、Firefox、Chrome、Safari、Opera)都支持XMLHttpRequest()對象。
var xhr = new XMLHttpRequest();
字面上意思:即“XML”通過