1.使用外部web组件,以Bootstrap为例

<head>

　　<link rel='stylesheet'  href='bootstrap-3.3.0-dist/dist/css/bootstrap.css' / >  导入主要的css文件

<link rel='stylesheet'  href='bootstrap-3.3.0-dist/dist/css/bootstrap-theme.css' / > 导入主题文件，里面是一些颜色

　　<style>

　　　　.ss{

　　　　　　color:red;   !important; 如果对某个样式做些修改，在这里定义自己的样式，并加上！important,表示该样式优先

　　　　　　}

　　</style>

</head>

<body>

　　<div >

　　     bootstrap代码{class='ss'#添加的自己的样式

　　　　　　　　　　　　}

　　</div>

　　<script src='jQuery-1.12.4.js'></script>  导入jQuery文件，Bootstrap依赖于jQuery

　　<script src='bootstrap-3.3.0-dist/dist/js/bootstrap.js'></script>  导入js文件

</body>

2.响应式布局,当页面最小宽度小于900px时，背景色变为红色

<style>

　　@media (min-width:900px) {

　　　　.c1{只需要在下边body中class=‘c1即可’

　　　　　　　background-color:red;

　　　　　　}

　　}

</style>

3.web框架原理 http://www.cnblogs.com/wupeiqi/articles/5237672.html

 import socket
 def handle_request(client):
     buf = client.recv(1024)
     client.send('HTTP/1.1 200 ok\r\n\r\n')
     client.send('hello,world')
 def main():
     sock = socket.socket(socket.AF_INET,socket.SOCK_STREAM)
     sock.bind(('localhost',8000))
     sock.listen(5)
     while True:
         conn, addr = sock.accept()
         handle_request(conn)
         conn.close()
 if __name__ == 'main':
     main()

Python封装的web服务器

#coding:utf-8

from wsgiref.simple_server import make_server

def RunServer(environ, start_response):
    #envision：客户端发来的所有数据
    #start_response:封装要韩会给用户的所有数据，包括响应头、状态码等
    start_response('200 OK', [('Content-Type', 'text/html')])
    url = environ['PATH_INFO']  #获取客户端发来的数据中的url
    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()

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

MTV

Model Template View
数据库 模板文件 业务处理
############## WEB：MVC、MTV

3.js正则表达式

test   - 判断字符串是否符合规定的正则
        rep = /\d+/;
        rep.test("asdfoiklfasdf89asdfasdf")
        # true

        rep = /^\d+$/;
        rep.test("asdfoiklfasdf89asdfasdf")
        # true

    exec   - 获取匹配的数据
        rep = /\d+/;
        str = "wangshen_67_houyafa_20"
        rep.exec(str)
        # ["67"]

        JavaScript is more fun than Java or JavaBeans!
        var pattern = /\bJava(\w*)\b/;
        # ["JavaScript", "Script"]

        JavaScript is more fun than Java or JavaBeans!
        var pattern = /\bJava\w*\b/g;
        # ["JavaScript"]
        # ["Java"]
        # ["JavaBeans"]
        # null

        JavaScript is more fun than Java or JavaBeans!
        var pattern = /\bJava(\w*)\b/g;
        # ["JavaScript",'Script']
        # ["Java", ""]
        # ["JavaBeans", "Beans"]
        # null

    多行匹配：
        默认就是多行匹配
        ^$
   - 登录注册验证
        默认事件先执行：
            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;
            })   

    后端：python实现

    业务处理
    ....

使用外部web组件-----easyUI、jQueryUI、Bootstrap、js正则表达式的更多相关文章

  1. Jquery Easyui验证扩展，Easyui验证，Easyui校验，js正则表达式

    Jquery Easyui验证扩展,Easyui验证,Easyui校验,js正则表达式 >>>>>>>>>>>>>> ...

  2. AmazeUI(妹子UI)中CSS组件、JS插件、Web组件的区别

    AmazeUI(妹子UI)是非常优秀的国产前端UI,现在来介绍一下AmazeUI中CSS组件.JS插件与Web组件的区别. CSS组件顾名思义就是仅使用CSS渲染而成的组件,而JS插件也很容易理解,就 ...

  3. amazeui中css组件、js组件、web组件的区别

    amazeui中css组件.js组件.web组件的区别 一.总结 一句话总结: 1.可直接像调用js插件那样调用:在AmazeUI(妹子UI)中,Web组件可以不编写模板而直接使用,若如此,则与JS插 ...

  4. JS组件系列——表格组件神器：bootstrap table

    前言:之前一直在忙着各种什么效果,殊不知最基础的Bootstrap Table用法都没有涉及,罪过,罪过.今天补起来吧.上午博主由零开始自己从头到尾使用了一遍Bootstrap Table ,遇到不少 ...

  5. JS组件系列——表格组件神器：bootstrap table（二：父子表和行列调序）

    前言:上篇 JS组件系列——表格组件神器:bootstrap table 简单介绍了下Bootstrap Table的基础用法,没想到讨论还挺热烈的.有园友在评论中提到了父子表的用法,今天就结合Boo ...

  6. RSuite 一个基于 React.js 的 Web 组件库

    RSuite http://rsuite.github.io RSuite 是一个基于 React.js 开发的 Web 组件库,参考 Bootstrap 设计,提供其中常用组件,支持响应式布局. 我 ...

  7. [转]JS组件系列——表格组件神器：bootstrap table

    原文地址:https://www.cnblogs.com/landeanfen/p/4976838.html 前言:之前一直在忙着各种什么效果,殊不知最基础的Bootstrap Table用法都没有涉 ...

  8. JS组件系列——表格组件神器：bootstrap table 包含了js对象的定义和对象成员函数的定义

    前言:之前一直在忙着各种什么效果,殊不知最基础的Bootstrap Table用法都没有涉及,罪过,罪过.今天补起来吧.上午博主由零开始自己从头到尾使用了一遍Bootstrap Table ,遇到不少 ...

  9. JS组件系列——表格组件神器：bootstrap table（三：终结篇，最后的干货福利）

    前言:前面介绍了两篇关于bootstrap table的基础用法,这章我们继续来看看它比较常用的一些功能,来个终结篇吧,毛爷爷告诉我们做事要有始有终~~bootstrap table这东西要想所有功能 ...

随机推荐

  1. webpack构建vue项目（配置篇）

    最近公司要求用vue重构项目,还涉及到模块化开发,于是乎,我专门花了几天的时间研究了一下webpack这个目前来看比较热门的模块加载兼打包工具,发现上手并不是很容易,现将总结的一些有关配置的心得分享出 ...

  2. GROUP_CONCAT将里面拼接的字符串排序

    SELECT oam.id , GROUP_CONCAT(oacm.name) category FROM om_article_manage oam LEFT JOIN om_article_cat ...

  3. static实现单例的隐患

    1. 前言 Java的单例有多种实现方式:单线程下的简单版本.无法在指令重排序下正常工作的Double-Check.static.内部类+static.枚举--.这篇文章要讨论的,是在使用static ...

  4. ubuntu终端窗口最大化（不是全屏）

    窗口最大化:ctrl+win窗+↑ 窗口还原:ctrl+win窗+↓ 这快捷键让人无语.好好的gnome被改造成unity,快捷键也改掉了.win窗+↑/↓为啥不用呢? 还有就是terminal的ta ...

  5. Downgrade PHP 7 to PHP 5.6 on Ubuntu 16.04

    Downgrade PHP 7 to PHP 5.6 on Ubuntu ubuntu16.04 系统源自带是7.0的,如何降级安装PHP 5.6呢 .? apt-get install -y lan ...

  6. Celery的实践指南

    http://www.cnblogs.com/ToDoToTry/p/5453149.html Celery的实践指南   Celery的实践指南 celery原理: celery实际上是实现了一个典 ...

  7. p/invoke碎片--对数组的封送处理

    因为数组是引用类型,所以数组的处理根据数组元素的类型是否为“可直接传递到非托管代码”的类型而分为两种情况.主要目标是看内存是怎么变化的,是复制还是锁定. 数组中的元素是"可直接传递到非托管代 ...

  8. 为你的pip更换一个国内的镜像源

    为你的pip更换一个国内的镜像源 是否常常为pypi官网被无故和谐掉导致pip不能下载python的各个包而痛心疾首? 是否常常在深夜里看着pip install 下载包的速度慢如乌龟而长吁短叹? 是 ...

  9. 初识cache

    1.cache是什么 cache这个名字用来称呼两种物理世界中存在的概念,硬体cache和cache机制.下面来分别介绍. 硬体cache:硬体cache是一种用肉眼可以看得见用皮肤可以摸得着的物品, ...

  10. 如何修改geditor的配置文件 -好像geditor没有文本格式的配置文件? 要使用dconf-editor来配置- geditor自己配置编码格式

    好像geditor没有文本格式的配置文件? 好像是通过一个程序, 叫 dconf-editor 来配置geditor的? 以前是通过gconf-editor来配置的, 但是gconf-editor的配 ...