目录:
一、JavaScript正则表达式
1、test
2、exec
二、BootStrap
1、响应式
2、图标、字体
3、基本使用
三、Django
1、安装
2、创建目录
3、进入创建的目录中,该目录概括一个目录与一个文件
4、运行程序
5、创建APP
6、APP目录
内容:
一、JavaScript正则表达式
1、test
判断字符串是否符合规定的正则表达式
例子:
rep = /^d+$/
rep.test('123')返回true
2、exec
获取匹配的数据,在匹配时,默认只能匹配到第一个即返回,且匹配值以数组形式存在
例子:分组匹配,会匹配两次,第一次匹配整体,第二次会将分组内容单独匹配出来
test = 'JavaScript is more fun than Java or JavaBeans!' "JavaScript is more fun than Java or JavaBeans!" var pattern = /Javaw*/ undefined pattern.exec(test) 输出:["JavaScript", index: 0, input: "JavaScript is more fun than Java or JavaBeans!"] var pattern = /Java(w*)/ pattern.exec(test) 输出:(2) ["JavaScript", "Script", index: 0, input: "JavaScript is more fun than Java or JavaBeans!"]
例子2:全局匹配 在匹配模板后面加g
test = 'JavaScript is more fun than Java or JavaBeans!' "JavaScript is more fun than Java or JavaBeans!" var pattern = /Javaw*/g undefined pattern.exec(test) ["JavaScript", index: 0, input: "JavaScript is more fun than Java or JavaBeans!"] pattern.exec(test) ["Java", index: 28, input: "JavaScript is more fun than Java or JavaBeans!"] pattern.exec(test) ["JavaBeans", index: 36, input: "JavaScript is more fun than Java or JavaBeans!"]
var pattern = /Java(w*)/g undefined test = 'JavaScript is more fun than Java or JavaBeans!' "JavaScript is more fun than Java or JavaBeans!" pattern.exec(test) (2) ["JavaScript", "Script", index: 0, input: "JavaScript is more fun than Java or JavaBeans!"] pattern.exec(test) (2) ["Java", "", index: 28, input: "JavaScript is more fun than Java or JavaBeans!"] pattern.exec(test) (2) ["JavaBeans", "Beans", index: 36, input: "JavaScript is more fun than Java or JavaBeans!"]
多行匹配:
默认就是多行匹配
m用于^或者$的情况,比如查找某个字符在两行开头或者结尾,默认情况下,尽管有 的换行,也被默认为是一个整体,所以在此情况下用m来进行匹配
test = 'JavaScript is more fun than Java or JavaBeans!' "JavaScript is more fun than Java or JavaBeans!" var pattern = /^Java(w*)/g undefined pattern.exec(test) (2) ["JavaScript", "Script", index: 0, input: "JavaScript is more fun than ↵Java or JavaBeans!"] pattern.exec(test) null //没有找到Java开头的字符
test = 'JavaScript is more fun than Java or JavaBeans!' "JavaScript is more fun than Java or JavaBeans!" var pattern = /^Java(w*)/gm undefined pattern.exec(test) (2) ["JavaScript", "Script", index: 0, input: "JavaScript is more fun than ↵Java or JavaBeans!"] pattern.exec(test) (2) ["Java", "", index: 29, input: "JavaScript is more fun than ↵Java or JavaBeans!"]
登录注册验证:
默认事件先执行:
checkbox
自定义先执行:
a:如果自定义事件,会先执行事件,如果该事件return false,就不会执行跳转操作
submit
二、BootStrap
- CSS
- JS
学习BootStrap规则
1、响应式
@media:
例子:缩放时变换颜色
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> .c1{ background-color:red; height:50px; } @media (min- 900px) { .c2{ background-color:grey; /*当屏幕宽度小于900px时就变成红色*/ } } </style> </head> <body> <div class="c1 c2"></div> </body> </html>
2、图标、字体
@font-face
3、基本使用
备注:
在修改bootstrap属性,变为自己的CSS属性时,需要在条目中加!important 这样保证在执行时自己的CSS属性优先级最高
前端写轮播图,可以访问www.bxsilder.com
三、Django
1、安装:
pip3 install django
2、创建目录:
django-admin startproject [项目名]
3、进入创建的目录中,该目录概括一个目录与一个文件:
项目名
- 与项目名一样 #对整个程序进行配置
- init.py
- settings.py #配置文件所在文件
- url #URL对应关系
- wsgi #遵循WSGI规范,线上程序一般采用uswgi + nignx
- manage.py 文件 #管理程序:
- python manage.py
- python manage.py startapp XXX
- python manage.py makemigrations
- python manage.py migrate
4、运行Django程序:
python3 manage.py runserver 0.0.0.0:8000 默认8000端口访问
例子:创建一个Django程序:
1、Pycharm中选择创建一个project,解释器选择python3.6
2、在urls中输入:
from django.conf.urls import url from django.contrib import admin from django.shortcuts import HttpResponse def home(request): return HttpResponse('<h1>index is here</h1>') urlpatterns = [ url(r'^admin/', admin.site.urls), url(r'^index/', home), ]
3、运行该程序
4、通过http://127.0.0.1:8000/index访问新创建的程序
5、创建App
python manage.py startapp APP_NAME
6、app目录:
migrations 数据操作记录(修改表结构的记录)
admin Django为用户提供的后台管理
apps 配置当前app
models ORM,写指定的类,通过命令可以创建数据库结构
tests 做单元测试
views 业务逻辑代码
例子:
编写log登录界面:
urls文件:
from cmdb import views url(r'^login', views.login),
views文件:该views文件在app名字叫cmdb中
from django.shortcuts import render #render是Django中打开文件,提取内容关闭该文件的一个快捷方式 def login(request): # f = open('templates/login.html','r',encoding='utf-8') # data = f.read() # f.close() # return HttpResponse(data) return render(request,'login.html')
settings文件中添加cmdb这个app:
INSTALLED_APPS = [ 'django.contrib.admin', 'django.contrib.auth', 'django.contrib.contenttypes', 'django.contrib.sessions', 'django.contrib.messages', 'django.contrib.staticfiles', 'cmdb', ]
添加templates目录,在该目录下添加login.html文件
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Login</title> <style> label{ width:80px; text-align: right; display: inline-block; } </style> </head> <body> <form action="/login" method="POST"> <p> <label for="username">用户名:</label> <input id="username" type="text"/> </p> <p> <label for="password">密码:</label> <input id="password" type="password"/> <input type="submit" value="提交"/> </p> </form> </body> </html>
添加静态文件:
创建static目录,然后在settings文件最后添加该目录
STATICFILES_DIRS = (
os.path.join(BASE_DIR,'static'),
)
在settings里注释掉CSRF:CSRF就是跨站请求伪造
MIDDLEWARE = [
'django.middleware.security.SecurityMiddleware',
'django.contrib.sessions.middleware.SessionMiddleware',
'django.middleware.common.CommonMiddleware',
#'django.middleware.csrf.CsrfViewMiddleware',
'django.contrib.auth.middleware.AuthenticationMiddleware',
'django.contrib.messages.middleware.MessageMiddleware',
'django.middleware.clickjacking.XFrameOptionsMiddleware',
]
定义路由规则:
url.py文件中
例如:'login' -->函数名
请求的方法:
用户请求全部在views文件的函数的request中,其中包括:
1、request.method 可以得到用户请求的方式 GET/POST
2、request.POST.get('', None)获取post方式请求发来的数据
3、request.GET.get('', None) 获取get方式请求发来的数据
回应用户请求的三种模式:
1、return HttpResponse(‘字符串’) #通过httpresponse直接回复字符串
2、return render(request,‘HTML模板的路径’,{XXX}) #render直接读取HTML文件并将结果返回给请求用户,后面的字段代指动态的数据,可以不写
3、return redirect(‘URL’) #redirect方式只能在里面填写URL而不能写HTML模板路径,如果重定向到本地文件需要对该URL前面加 ‘/’这个/代指域名,在例子中代指0.0.0.0:8000
模板渲染:
特殊的模板语言
1、普通变量:
{{变量名}}
2、for循环
views.py中 USER_LIST = [] def home(request): if request.method == 'POST': user = request.POST.get('username',None) email = request.POST.get('email',None) gender = request.POST.get('gender',None) temp = {'username':user,'email':email, 'gender':gender} USER_LIST.append(temp) return render(request,'home.html',{'user_list': USER_LIST}) html中: <tbody> {% for row in user_list %} <tr> <td>{{ row.username }}</td> <td>{{ row.email }}</td> <td>{{ row.gender }}</td> </tr> {% endfor %} </tbody>
对于后端的列表和字典:
例子:
return render(request, 'index.html ',{
'current_user': 'small_a',
'user_list': ['small_a','small_b'],
'user_dict':{'k1','v1','k2': 'v2'},
})
html中:
<div>{{ current_user}}</div>
<a>{{user_list.1}}</a> #取列表中元素
<a>{{user_dict.k1}}</a> #取字典中的元素
3、if语句
{%if age %}
<a>有年龄</a>
{%if age >16 %}
<a>老男人</a>
{%endif%}
{%endif%}