一、 正則表達式
1、定義正則表達式
/.../ 用於定義正則表達式
/.../g 表示全局匹配
/.../i 表示不區分大小寫
/.../m 表示多行匹配
JS正則匹配時本身就是支持多行，此處多行匹配只是影響正則表達式^和$，m模式也會使用^$來匹配換行的內容)
var pattern = /^Java\w*/gm; var text = "JavaScript is more fun than \nJavaEE or JavaBeans!"; result = pattern.exec(text) result = pattern.exec(text) result = pattern.exec(text)
注：定義正則表達式也可以 reg= new RegExp()
2、匹配
JavaScript中支持正則表達式，其主要提供了兩個功能：
test(string) 檢查字符串中是否和正則匹配
rep = /\d+/;
rep.test("asdfoiklfasdf89asdfasdf")# true
rep = /^\d+$/;
rep.test("123456789")# true# 只要正則在字符串中存在就匹配，如果想要開頭和結尾匹配的話，就需要在正則前後加 ^和$
exec(string) 獲取正則表達式匹配的內容，如果未匹配，值爲null，否則，獲取匹配成功的數組。
獲取正則表達式匹配的內容，如果未匹配，值爲null，否則，獲取匹配成功的數組。 非全局模式 獲取匹配結果數組，注意：第一個元素是第一個匹配的結果，後面元素是正則子匹配（正則內容分組匹配） var pattern = /\bJava\w*\b/; var text = "JavaScript is more fun than Java or JavaBeans!"; result = pattern.exec(text) var pattern = /\b(Java)\w*\b/; var text = "JavaScript is more fun than Java or JavaBeans!"; result = pattern.exec(text) 全局模式 需要反覆調用exec方法，來一個一個獲取結果，直到匹配獲取結果爲null表示獲取完畢 var pattern = /\bJava\w*\b/g; var text = "JavaScript is more fun than Java or JavaBeans!"; result = pattern.exec(text) var pattern = /\b(Java)\w*\b/g; var text = "JavaScript is more fun than Java or JavaBeans!"; result = pattern.exec(text)
字符串中相關方法
obj.search(regexp) 獲取索引位置，搜索整個字符串，返回匹配成功的第一個位置(g模式無效) obj.match(regexp) 獲取匹配內容，搜索整個字符串，獲取找到第一個匹配內容，如果正則是g模式找到全部 obj.replace(regexp, replacement) 替換匹配替換，正則中有g則替換所有，否則只替換第一個匹配項， $數字：匹配的第n個組內容； $&：當前匹配的內容； $`：位於匹配子串左側的文本； $'：位於匹配子串右側的文本 $$：直接量$符號
二、登錄註冊驗證
默認事件先執行：
checkbox
自定義先執行
a
submit
...
<form>
<input type='type' />
<input type='password' />
<input type='submit' />
</form>
$(':submit').click(function(){
$(':text,:password').each(function(){
... return false;
}) return false;
})
input,checbox
================================== 驗證 ================================
JS： 驗證
各種驗證
$(':submit').click(function(){
$(':text,:password').each(function(){
... return false;
}) return false;
})三、組件
1.BootStrap
下載：http://www.bootcss.com/
學習 BootStrap 規則
一、響應式
@media
例：響應式佈局
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
.c1{
background-color: red;
height: 50px;
}
@media (min-width: 700px) {
.c2{
background-color: grey;
}
}
</style>
</head>
<body>
<div class="c1 c2"></div>
</body>
</html>二、圖標、字體
@font-face
三、基本使用
加個最先應用的格式
<style>
.no-redus{
border-radius: 0px; !important;
}
</style>2.jQUeryUI *
下載：http://jqueryui.com/
3.EasyUI
下載：http://www.jeasyui.net/
修改css並應用
4.jquery.bxslider輪播圖
http://bxslider.com/ 下載引用
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="jquery.bxslider/jquery.bxslider.css">
</head>
<body>
<ul class="bxslider">
<li><img src="image/1.png" style="width: 500px;height: 200px;"/></li>
<li><img src="image/1.png" style="width: 500px"/></li>
<li><img src="image/1.png" style="width: 500px"/></li>
</ul>
<script src="js/jquery-1.12.4.js"></script>
<script src="jquery.bxslider/jquery.bxslider.js"></script>
<script>
$(document).ready(function(){
$('.bxslider').bxSlider();
});
</script>
</body>
</html>四、web框架
MVC
Model View Controller
數據庫 模板文件 業務處理
MTV
Model Template View
數據庫 模板文件 業務處理
############## WEB：MVC、MTV
Web框架本質
衆所周知，對於所有的Web應用，本質上其實就是一個socket服務端，用戶的瀏覽器其實就是一個socket客戶端。
#!/usr/bin/env python#coding:utf-8
import socket
def handle_request(client):
buf = client.recv(1024)
client.send("HTTP/1.1 200 OK\r\n\r\n")
client.send("Hello, Seven")
def main():
sock = socket.socket(socket.AF_INET, socket.SOCK_STREAM)
sock.bind(('localhost',8000))
sock.listen(5)
while True:
connection, address = sock.accept()
handle_request(connection)
connection.close()
if __name__ == '__main__':
main()上述通過socket來實現了其本質，而對於真實開發中的python web程序來說，一般會分爲兩部分：服務器程序和應用程序。服務器程序負責對socket服務器進行封裝，並在請求到來時，對請求的各種數據進行整理。應用程序則負責具體的邏輯處理。爲了方便應用程序的開發，就出現了衆多的Web框架，例如：Django、Flask、web.py 等。不同的框架有不同的開發方式，但是無論如何，開發出的應用程序都要和服務器程序配合，才能爲用戶提供服務。這樣，服務器程序就需要爲不同的框架提供不同的支持。這樣混亂的局面無論對於服務器還是框架，都是不好的。對服務器來說，需要支持各種不同框架，對框架來說，只有支持它的服務器才能被開發出的應用使用。這時候，標準化就變得尤爲重要。我們可以設立一個標準，只要服務器程序支持這個標準，框架也支持這個標準，那麼他們就可以配合使用。一旦標準確定，雙方各自實現。這樣，服務器可以支持更多支持標準的框架，框架也可以使用更多支持標準的服務器。
WSGI（Web Server Gateway Interface）是一種規範，它定義了使用python編寫的web app與web server之間接口格式，實現web app與web server間的解耦。
python標準庫提供的獨立WSGI服務器稱爲wsgiref。
#!/usr/bin/env python#coding:utf-8
from wsgiref.simple_server import make_server
def RunServer(environ, start_response):
start_response('200 OK', [('Content-Type', 'text/html')]) return ['<h1>Hello, web!</h1>'.encode('utf-8'),]
if __name__ == '__main__':
httpd = make_server('', 8000, RunServer) print "Serving HTTP on port 8000..."
httpd.serve_forever()五、Django
1.安裝
pip3 install django
2.創建Django工程
django-admin startproject 【工程名稱】
例如：工程名稱爲mysite；那麼mysite目錄下會產生如下目錄及文件。
mysite
- mysite # 對整個程序進行配置
- init
- settings # 配置文件
- url # URL對應關係
- wsgi # 遵循WSIG規範，uwsgi + nginx
- manage.py # 管理Django程序：
- python manage.py
- python manage.py startapp xx
- python manage.py makemigrations
- python manage.py migrate
Bottle默認支持多種基於WSGI的服務，如：
server_names = {
'cgi': CGIServer,
'flup': FlupFCGIServer,
'wsgiref': WSGIRefServer,
'waitress': WaitressServer,
'cherrypy': CherryPyServer,
'paste': PasteServer,
'fapws3': FapwsServer,
'tornado': TornadoServer,
'gae': AppEngineServer,
'twisted': TwistedServer,
'diesel': DieselServer,
'meinheld': MeinheldServer,
'gunicorn': GunicornServer,
'eventlet': EventletServer,
'gevent': GeventServer,
'geventSocketIO':GeventSocketIOServer,
'rocket': RocketServer,
'bjoern' : BjoernServer,
'auto': AutoServer,
}3.運行Django功能
語法:python manage.py runserver ip:port
python manage.py runserver 127.0.0.1:8001
4.創建APP
python manage.py startapp cmdb
- migrations 數據修改表結構
- admin Django爲我們提供的後臺管理
- apps 配置當前app
- models ORM,寫指定的類 通過命令可以創建數據庫結構
- tests 單元測試
- views 業務代碼
示例：表單驗證
內容整理
1. 創建Django工程
django-admin startproject 工程名
2. 創建APP
cd 工程名
python manage.py startapp cmdb
3、靜態文件
project.settings.py
STATICFILES_DIRS = (
os.path.join(BASE_DIR, "static"),
)
4、模板路徑
DIRS ==> [os.path.join(BASE_DIR,'templates'),]
5、settings中
middlerware
# 註釋 csrf
6、定義路由規則
url.py
"login" --> 函數名
7、定義視圖函數
app下views.py
def func(request): # request.method GET / POST
# http://127.0.0.1:8009/home?nid=123&name=alex
# request.GET.get('',None) # 獲取請求發來的而數據
# request.POST.get('',None)
# return HttpResponse("字符串")
# return render(request, "HTML模板的路徑")
# return redirect('/只能填URL')
8、模板渲染
特殊的模板語言
-- {{ 變量名 }}
def func(request): return render(request, "index.html", {'current_user': "alex"})
index.html
<html>
..
<body>
<div>`current_user`</div>
</body>
</html>
====> 最後生成的字符串
<html>
..
<body>
<div>alex</div>
</body>
</html>
-- For循環 def func(request): return render(request, "index.html", {'current_user': "alex", 'user_list': ['alex','eric']})
index.html
<html>
..
<body>
<div>`current_user`</div>
<ul>
{% for row in user_list %}
{% if row == "alex" %}
<li>{{ row }}</li>
{% endif %}
{% endfor %}
</ul>
</body>
</html>
#####索引#################
def func(request): return render(request, "index.html", { 'current_user': "alex",
'user_list': ['alex','eric'],
'user_dict': {'k1': 'v1', 'k2': 'v2'}})
index.html
<html>
..
<body>
<div>`current_user`</div>
<a> {{ user_list.1 }} </a>
<a> {{ user_dict.k1 }} </a>
<a> {{ user_dict.k2 }} </a>
</body>
</html>
###### 條件
def func(request): return render(request, "index.html", { 'current_user': "alex",
"age": 18, 'user_list': ['alex','eric'],
'user_dict': {'k1': 'v1', 'k2': 'v2'}})
index.html
<html>
..
<body>
<div>`current_user`</div>
<a> {{ user_list.1 }} </a>
<a> {{ user_dict.k1 }} </a>
<a> {{ user_dict.k2 }} </a>
{% if age %}
<a>有年齡</a>
{% if age > 16 %}
<a>老男人</a>
{% else %}
<a>小鮮肉</a>
{% endif %}
{% else %}
<a>無年齡</a>
{% endif %}
</body>
</html>