zoukankan      html  css  js  c++  java
  • 第八章(1)

    目录

    1. js正册表达式
    2. 提交事件顺序
    3. web模板
    4. Django
    5. Django内容整理
    6. Django请求生命周期

    1.js正册表达式

    test

    匹配到返回true
    rep = /d+/
    /d+/
    rep.test("asdsdf")
    false
    
    rep.test("asd12")
    true
    
    ^$ 精确匹配
    rep = /^d+$/;
    /^d+$/
    rep.test("112sdf")
    false
    rep.test("11")
    true
    

    exec

    分组匹配和匹配所有(W*) g
    text = "JavaScript is more fun than 
    Java or JavaBeans!"
    var rep = /^Java(W*)/g;
    rep.exec(text)
    
    匹配所有行m
    text = "JavaScript is more fun than 
    Java or JavaBeans!"
    var rep = /^Java(W*)/gm;
    rep.exec(text)
    

    2.提交时间顺序

    -登录注册验证
    	默认事件先执行
    		checkbox
    	自定义事件先执行
    		a
    		submit
    		
    		<form>
    			<input type='type'/>
    			<input type='password' />
    			<input type='submit' />
    		<form>
    		
    		$(':submit').click(function(){
              $(':text,:password').each(function(){
                retuen false;
              })
              return false;
    		})
    

    3.web模板

    Ajax操作
    http://www.jeasyui.com/
    
    jqyeryui
    http://jqueryui.com/
    
    bootstrap
    http://www.bootcss.com/
    https://v3.bootcss.com/
    
    bootstrap 模板
    http://www.cssmoban.com/tags.asp?page=3&n=Bootstrap

    bootstrap(响应式)

    @media

       <style>
            .c1{
                background-color:red;
                height:50px;
            }
            @media(min-900px){
                .c2{
                    background-color:grey;
                }
            }
        </style>
    </head>
    <body>
        <div class="c1 c2"></div>
    </body>
    

    !important(强制样式生效)

    <style>
    	.no-radus{
          border-radius: 0 !important;
    	}
    <style>
    <link rel="stylesheet" href="bootstrap-3.3.0-dist/bootstrap.css"/>
    

    图标 字体

    @font-face

    轮播图

    <head>
    
        <meta charset="UTF-8">
        <title>Title</title>
        <link rel="stylesheet" href="jquery.bxslider.css"/>
    </head>
    <body>
         <ul class="bxslider">
             <li><img src="images/1.jpg" /></li>
             <li><img src="images/2.jpg" /></li>
             <li><img src="images/3.jpg" /></li>
             <li><img src="images/4.jpg" /></li>
         </ul>
    
        <script src="jquery.js"></script>
        <script src="jquery.bxslider.js"></script>
        <script>
            // $(document).ready(function(){
            //     $('.bxslider').bxSlider();
            // });
    
            $(function(){
                $('.bxslider').bxSlider({
                    auto: true,
                    autoControls: true
                });
            });
        </script>
    </body>

    WEB:mvc mtv

    MVC
        Model   View     Controller
        数据库   模板文件 业务处理
        
    MTV 
    	Model    temolates    views
        数据库    模板文件 业务处理
    

    Django

    1.pip3 install dango 
    
    2.设置环境变量
    D:ProgramsPythonPython35Scripts
    
    3.创建django
    django-admin startproject mysite
    
    4.启动django 
    cd mysite
    python manage.py runserver 127.0.0.1:8001
    

    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
    
    from django.contrib import admin
    from django.urls import path
    from django.shortcuts import HttpResponse
    
    def home(request):
        return HttpResponse('<h1>Hello</h1>')
    urlpatterns = [
        path('admin/', admin.site.urls),
        path('h.html/', home),
    ]

    创建APP

    python manage.py startapp cmdb
    
    from django.contrib import admin
    from django.urls import path
    from cmdb import views
    urlpatterns = [
        path('admin/', admin.site.urls),
        path('h.html/', views.home),
    ]
    

    APP文件说明

    app:
    	migrations   数据修改表结构记录文件
    	admin         Django为我们提供的后台管理
    	apps           配置当前app
    	models       ORM,写指定的类 通过命令可以创建数据库结构
    	tests          单元测试
    	views         业务代码
    

    urls.py

     1 from django.contrib import admin
     2 from django.urls import path
     3 from cmdb import views
     4 from django.conf.urls import url
     5 urlpatterns = [
     6     # path('admin/', admin.site.urls),
     7     # path('h.html/', views.home),
     8     url(r'login',views.login),
     9 ]
    10 
    11 cmdb/views.py
    12 
    13 from django.shortcuts import HttpResponse
    14 from django.shortcuts import render
    15 
    16 def login(request):
    17     return render(request,'login.html')
    18 
    19 templates/login.html
    View Code

    Django静态文件以及模板文件调用顺序

    1.urls.py

    1 from django.contrib import admin
    2 from django.urls import path
    3 from cmdb import views
    4 from django.conf.urls import url
    5 urlpatterns = [
    6     # path('admin/', admin.site.urls),
    7     # path('h.html/', views.home),
    8     url(r'login',views.login),
    9 ]
    View Code

    2.cmdb/views.py

    1 from django.shortcuts import HttpResponse
    2 from django.shortcuts import render
    3 
    4 def login(request):
    5     return render(request,'login.html')
    View Code

    3.templates/login.html

     1  <title>Title</title>
     2     <link rel="stylesheet" href="/static/commons.css">
     3     <style>
     4         label{
     5              80px;
     6             text-align: right;
     7             display: inline-block;
     8         }
     9     </style>
    10 </head>
    11 <body>
    12     <form action="/login" method="post">
    13         <p>
    14             <label for="username">用户名</label>
    15             <input id="username" type="text"/>
    16         </p>
    17         <p>
    18             <label for="password">密码:</label>
    19             <input id="password" type="text" />
    20             <input type="submit" value="提交" />
    21         </p>
    22     </form>
    23     <script src="/static/jquery.js"></script>
    24 </body>
    View Code

    4.settings.py

     1 TEMPLATES = [
     2     {
     3         'BACKEND': 'django.template.backends.django.DjangoTemplates',
     4         'DIRS': [os.path.join(BASE_DIR, 'templates')]    ####
     5         ,
     6         'APP_DIRS': True,
     7         'OPTIONS': {
     8             'context_processors': [
     9                 'django.template.context_processors.debug',
    10                 'django.template.context_processors.request',
    11                 'django.contrib.auth.context_processors.auth',
    12                 'django.contrib.messages.context_processors.messages',
    13             ],
    14         },
    15     },
    16 ]
    17 
    18 
    19 
    20 
    21 STATICFILES_DIRS = (
    22     os.path.join(BASE_DIR,'static'),
    23 )
    View Code

    django验证用户密码是否正确

    1.settings.py

    1 MIDDLEWARE = [
    2     'django.middleware.security.SecurityMiddleware',
    3     'django.contrib.sessions.middleware.SessionMiddleware',
    4     'django.middleware.common.CommonMiddleware',
    5     #'django.middleware.csrf.CsrfViewMiddleware',   注释掉
    6     'django.contrib.auth.middleware.AuthenticationMiddleware',
    7     'django.contrib.messages.middleware.MessageMiddleware',
    8     'django.middleware.clickjacking.XFrameOptionsMiddleware',
    9 ]
    View Code

    2.templates/login.html

     1 <head>
     2     <meta charset="UTF-8">
     3     <title>Title</title>
     4     <link rel="stylesheet" href="/static/commons.css">
     5     <style>
     6         label{
     7              80px;
     8             text-align: right;
     9             display: inline-block;
    10         }
    11     </style>
    12 </head>
    13 <body>
    14     <form action="/login" method="post">
    15         <p>
    16             <label for="username">用户名</label>
    17             <input id="username" name="user" type="text"/>
    18         </p>
    19         <p>
    20             <label for="password">密码:</label>
    21             <input id="password" name="pwd" type="password" />
    22             <input type="submit" value="提交" />
    23             <span style="color: red;">{{ error_msg }}</span>  ####
    24         </p>
    25     </form>
    26     <script src="/static/jquery.js"></script>
    27 </body>
    View Code

    3.cmdb/views.py

     1 def login(request):
     2 
     3     error_msg = ""
     4     if request.method == "POST":
     5         user = request.POST.get('user',None)
     6         pwd = request.POST.get('pwd',None)
     7         if user == "root" and pwd == "123":
     8             return redirect('http://www.baidu.com')
     9         else:
    10             error_msg = "用户名或密码错误"
    11 
    12     return render(request,'login.html', {'error_msg': error_msg})
    View Code

    input添加示例

    1.urls.py

    1 urlpatterns = [
    2     url(r'home',views.home),
    View Code

    2.templates/home.html

     1 <!DOCTYPE html>
     2 <html lang="en">
     3 <head>
     4     <meta charset="UTF-8">
     5     <title>Title</title>
     6 </head>
     7 <body style="margin: 0">
     8     <div style="height: 48px;background-color: #dddddd"></div>
     9     <div>
    10         <form action="/home" method="post">
    11             <input type="text" name="username" placeholder="用户名"/>
    12             <input type="text" name="email" placeholder="邮箱"/>
    13             <input type="text" name="gender" placeholder="性别"/>
    14             <input type="submit" value="添加"/>
    15         </form>
    16     </div>
    17     <div>
    18         <table>
    19             {% for row in user_list %}
    20                 <tr>
    21                     <td>{{ row.username }}</td>
    22                     <td>{{ row.gender }}</td>
    23                     <td>{{ row.email }}</td>
    24                 </tr>
    25             {% endfor %}
    26         </table>
    27     </div>
    28 </body>
    29 </html>
    View Code

    3.cmdb/views.py

     1 USER_LIST = [
     2     {'username': 'zhang','email': 'zhang@163.com','gender': 'man'},
     3     {'username': 'li','email': 'li@163.com','gender': 'man'},
     4     {'username': 'wang','email': 'wang@163.com','gender': 'man'}
     5 ]
     6 def home(request):
     7     if request.method == "POST":
     8 
     9         u = request.POST.get('username')
    10         e = request.POST.get('email')
    11         g = request.POST.get('gender')
    12         temp = {'username': u, 'email': e,'gender': g}
    13         USER_LIST.append(temp)
    14     return render(request,'home.html',{'user_list': USER_LIST})
    View Code

    内容整理

    1.创建Django工程

    django-admin startproject 工程名
    

    2.创建APP

    cd 工程名
    python manage.py startapp cmdb
    

    3.静态文件

    project.setting.py
    
    STATICILES_DIRS = (
    	os.path.join(BASE_DIR,""static),
    )
    

    4.模板路径

    DIRS ==> [os.path.join(BASE_DIR,'templates'),]
    

    5.settings中

    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.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 %}
    				<li>{{ row }}</li>
    			{% endfor %}
    		</ul>
    	</body>
    <html>
    

    索引

    def func(request):
    	return render(request,"index.html",{
            'current_user':'alex',
            'user_list':['alex','eric'],
            'user_list':{'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',
            'user_list':['alex','eric'],
            'user_list':{'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>
            {% else %}
            	<a>无年零</a>
            {% endif %}
    	</body>
    </html>
    

    6.Django请求生命周期

       -> URL对应关系(匹配) -> 试图函数 -> 返回用户字符串
       -> URL对应关系(匹配) -> 试图函数 -> 打开一个HTML文件,读取内容
    

      

  • 相关阅读:
    HttpModule和在Global.asax区别
    SQL Server中视图的特点与优化
    SQL中int类型与varchar类型的隐式转换
    利用SQL语句查询SQL中所有正在执行的命令
    jquery子窗体操作父窗体中的元素
    js 连接数据库
    典型的列变行,用动态语句来做
    js中with、this的用法
    SQL SERVER数据库状态(脱机,联机,可疑)及SQL设置语句详解
    UVA 10465 Homer Simpson
  • 原文地址:https://www.cnblogs.com/hanwei999/p/8544479.html
Copyright © 2011-2022 走看看