Web-2

前言:之前我们讲了如何下载的编译器和服务器及如何使用,这一次我们就讲一下基本知识和一些简单案例。

目录

一. cs与bs的区别

二.一个完整的URL由哪几个部分组成

三.如何修改Tomcat服务器的默认端口号

四.关于BS

1.为什么需要基于B/S技术的动态网页

2.BS技术的特点是什么

五.什么是JSP

1.JSP (Java Server Pages)是指:

 2.Web容器处理JSP文件请求需要经过的3个阶段

 3.JSP页面组成

page指令

小脚本于表达式

声明

注释

六.案例 

一. cs与bs的区别
首先我们要了解什么是cs什么是bs

cs:client/server 客户端,服务器(类似于QQ聊天)

bs:brower/server 浏览器,服务器(类似于淘宝)

二.一个完整的URL由哪几个部分组成
由三个部分组成,分别是:

协议  主机  端口

http(http代表超文本传输协议)://localhos(主机)t:8080(端口号)

三.如何修改Tomcat服务器的默认端口号
首先我们要关闭服务器,右键点击stop,然后双击打开

  

四.关于BS
1.为什么需要基于B/S技术的动态网页
使用动态网页,可以动态输出网页内容、同用户进行交互、对网页内容进行在线更新

2.BS技术的特点是什么


 客户端发出请求
 请求发到服务器
 服务器处理请求(查询,插入)
服务器把响应给客户端

这里主要是依据jsp文件实现的

jsp是一个文件格式:
    java + html + css +js

但jsp本质上就是一个java文件

我们写的是jsp文件,但实际上
tomcat会把jsp文件变成java文件
jvm(java编译器)会把java变成.class

五.什么是JSP
1.JSP (Java Server Pages)是指:
在HTML中嵌入Java脚本代码 由应用服务器中的JSP引擎来编译和执行嵌入的Java脚本代码 然后将生成的整个页面信息返回给客户端

 2.Web容器处理JSP文件请求需要经过的3个阶段
a.翻译阶段   b.编译阶段   c.执行阶段

 3.JSP页面组成
静态内容    HTML静态文本
指令    以“<%@ ” 开始,以“%> ” 结束。 比如:<%@ include file = " Filename" %>
表达式    <%=Java表达式 %>
小脚本    <% Java 代码 %>
声明    <%! 方法 %>
注释    <!-- 这是注释,但客户端可以查看到 --> <%-- 这也是注释,但客户端不能查看到 --%>
page指令
通过设置内部的多个属性来定义整个页面的属性

语法:<%@ page 属性1="属性值" 属性2="属性值1,属性值2"… 属性n="属性值n"%>

小脚本于表达式


声明
 声明就是在JSP页面中定义Java的变量和方法

注释
在JSP文件的编写过程中,共有三种注释方法:

HTML的注释:<!-- html注释-->

JSP注释:<%-- JSP注释--%>

在JSP脚本中注释:

<% //单行注释 %>

<%  /*多行注释 */ %>

六.案例 
登陆界面代码:

<meta charset="UTF-8">
<title>登录界面</title>
</head>
<body>
 
<script src="js/jquery-3.5.1.js"></script>
<script src="jquery-validation-1.19.0/dist/jquery.validate.js"></script>
    <script src="jquery-validation-1.19.0/dist/localization/messages_zh.js"></script>
<!-- 
表单(form)
    action 表单提交的地址
    method 提交的方式
        * get 【默认】 显示在地址栏上面,数据长度有限制
        * post 不显示在地址栏上,数据长度无限制
【输入框上面必须要携带 name】
-->
 
    <form action="doLogin.jsp" method="post">
       <p>
       <input type="text" name="userName" placeholder="请输入用户名">
       </p>
       
       <p>
       <input type="password" name="userPwd" placeholder="请输入密码">
       </p>
       
       <p>
       <input type="number" name="userAge" placeholder="请输入年龄">
       </p>
       
       <p>
         <input type="checkbox" name="habit" value="唱歌">唱歌
         <input type="checkbox" name="habit" value="小提琴">小提琴
         <input type="checkbox" name="habit" value="乒乓球">乒乓球
         <input type="checkbox" name="habit" value="画画">画画
       </p>
       
       <p>
       <button>登录</button>
       </p>
       
       <script>
        $("form").validate({
            // 字段验证规则
            rules:{
                userName:{
                 required: true,//必须填写字段
                rangelength:[5,10],//必须填写5-10
                },
                userPwd:{
                    required: true,//必须填写字段
                    rangelength:[5,10],//必须填写5-10
                }
            },
             // 更改原本的错误提示语句
            messages:{
                     userPwd:{
                        required:"密码为空",
                            }
                    }
        })
            
        
        </script>
       
    </form>
</body>
</html>

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值