JavaWeb学习
JavaWeb--Html
1、提交按钮
<button οnclick="alert('你好')">提交</button>,onclick属性后面加的是点击按钮后的响应事件,使用alert属性后点击按钮就会出现一个提示框,弹出“你好”。
2、页面中显示 和 " (空格)"方法
<!-- 根据需要查看显示字符实体的标签符号-->这是<br>标签 <br/> --> 使用<和>将想要显示的标签包裹起来就能在页面显示出来这个标签。     空     格 </br> --> 在html编辑页面中,空格打再多也只会显示一个,想要在页面出先很多空格就使用 , 一个该标签代表一个空格。
3、页面跳转样式
<a href="http://www.baidu.com" target="_blank">,<a>标签中的target属性用来规定跳转样式,在其中填入_blank就会新打开一个页面,地址是href中的地址, 填入_self就会在原来页面上打开href标签中的地址。
4、有序列表(ul)和无序列表(ol)
-
- ,这两个标签中的type属性可以用来规定列表前的序号样式,none是取消样式,I是罗马数字,a是小写字母,A是大写字母,i是小写罗马数字,1是阿拉伯数字
5、img标签
<img src="../images/bjn.png" width="210" height="300" border="2" alt="当路径指定的资源找不到就会显示出该文本">,在img标签中,src是指向资源路径, 支持相对路径和绝对路径,height和width是设置高和宽,border是设置边框的宽,alt是在服务器找不到这个路径指向的资源时就会在这个标签区域显示这句话。
6、表格<table>
<table align="right" border="1" width="500" height="500" bgcolor="#7fffd4" cellspacing="0">,在table标签中可以设置表格的样式宽高,align是设 置表格在页面对齐方式,center、left、right三种方式分别对应左右居中,cellspacing是设置单元格之间的间隔。表格中<tr>代表一行,<td>代表一列,第一行标签使用<th> 在其中显示的字体会有加粗效果。
7、iframe标签
<iframe src="../images/sj2.png" name="photo" width="800" height="600" align="center"></iframe>,iframe标签可以在html页面中显示出一个展示框, 其中可以显示图片文字HTML页面等资源,通过src设置资源路径,通过height和width设置高和宽,name属性设置的值对应target属性对应的值。下表中的target值和这个name属性 对应就能实现点击列表链接,让列表中的内容出现在iframe所生成的框中。 <ol> <li><a href="../images/bjn.png" target="photo">美女</a></li> <li><a href="../images/xmt1.png" target="photo">熊猫头</a></li> <li><a href="../images/sj1.png" target="photo">有趣设计</a></li> <li><a href="http://www.ksssssss.com" target="photo">青年时刻</a></li> <li><a href="https://netcut.cn/xyk" target="photo">粘贴板</a></li> </ol>
8、div标签和span标签
<div class="class">div3</div> 一对div标签经常被当作是一个盒子使用,在里面装入页面元素以达到静态页面布局的效果,通过css对div盒子进行渲染修饰,class和id属性作为标志来连接css文件,class创建css 代码格式是:.classname{#css代码},id创建css代码格式是#idname{css代码},在css代码中实现对盒子的样式修饰渲染。span也差不多。 <div id="div001">div2</div> <div>div1</div> <span class="class_span">span1</span> <span id="span001">span2</span> <span id="span002">span3</span>
JavaWeb--JavaScript
特点
JavaScript的特点是交互性(用来进行信息之间的交互)、跨平台性、安全性(不被允许直接访问本地硬盘)
使用
<script type="text/javaScript"> //javaScript自带的警告框函数 alert("hello JavaScript"); </script>
javaScript文件的引入和基本功能
通过src将js文件引入路径。可以是相对路径也可以是绝对路径
script有两个功能,在其中书写JavaScript代码或引入js文件,但是只能二选一,不能一起用
如果想要有两个提示可以重新再写一个script标签再进行书写js代码
JavaScript的基本元素
JavaScript中的数据类型 数值类型 number 字符串类型 String 布尔类型 boolean 函数类型 function 对象类型 object javaScript中特殊的值 undefined 未定义类型,当js变量未赋予初始值的时候,都是undefined null 空值 NAN 全称是:Not a Number 非数值非数字 变量定义方式 var 变量名; var 变量名 = 值; 当JavaScript中数字和字符串进行运算结果就是NAN类型的 进行定义变量时,先给变量赋值后还可以再给变量进行赋值,数据类型会随之变化 关系比较运算符 等于 == 简单进行数值比较 全等于 === 不仅进行数值比较还进行数据类型的比较 其他和Java一样的用 逻辑运算 且运算 && 或运算 || 取反运算 ! 在JavaScript中所有变量都可以当作Boolean类型进行运算比较 0,null,undefined,空字符串”“都是false 在进行且运算时当两个都是真就会返回最后一个变量的值,当有一个假的就会返回第一个为假的变量的值 在进行或运算时当两个值都是假的就会返回最后一个值,当有一个真的时就会返回第一个为真的变量值 数组 数组定义 var 数组名 = 【】;空数组 var 数组名 = 【a,d,f,3,4,o】; 函数 函数定义 function 函数名(形参列表){ 函数体 } 函数定义的第二种方式 var 函数名 = function(形参列表){函数体} js中的函数不能重载,重载会致使第一次的函数定义被覆盖 在function函数中有一个arguments隐形参数,不需要定义,就可以获取所有参数的变量,叫做隐形函数 利用arguments可以对参数进行数组操作,预先设定的形参并不会影响arguments的使用,参数可以在函数调用赋值环节再加 类型判断就可以使用if配typeof函数判断处理 js中数字字符串相加会进行字符串拼接操作,产生的结果就是拼接字符串 对象的定义: var 变量名 = {属性名:值,属性名:值,函数名:function(){},....} //空对象 var 变量名 = new Object(); 变量名.属性名=值 变量名.函数名 = function(){} 对象的调用: 变量名.属性名/函数名(); 在函数内部可以使用this关键字调用本对象的属性
JavaScript的事件
JavaScript的事件 onload加载完成事件 加载js完成页面初始化操作 onclick单击事件 页面点击响应事件 onblur失去焦点事件 输入框失去焦点时验证输入内容是否合法 onchange内容发生改变事件 下拉列表和输入框内容发生改变的时候 onsubmit表单提交事件 表单提交前验证表单项是否合法 事件的注册: 静态注册:直接在标签事件发生后就赋予事件响应代码 动态注册:通过js代码先获得指定dom对象,然后通过dom对象.事件名 = function(){} 赋予事件响应后的代码 动态注册的步骤 1.获得标签对象 2.标签对象.事件名 = function(){} <script type="text/javascript"> // window.onload = function (){ // alert("动态注册") // } // var onloadfun = function (){ // alert("静态注册") // } function onclickfun(){ alert("静态注册") } window.οnclick= function () { var onclickfun1 = document.getElementById("but1"); onclickfun1.onclick = function () { alert("动态注册") } } function onblurfun(){ console.log("静态注册失去焦点") } window.onload = function () { var onblurid = document.getElementById("onblur01") onblurid.onblur = function () { console.log("动态注册失去焦点") } } function onchangefun() { alert("地址选择已修改成功") } window.onload = function () { var changeid = document.getElementById("change01"); changeid.onchange = function () { alert("修改成功") } } function onsubtionfun() { alert("静态注册提交被拦截") return false; } window.onload = function () { var formObj = document.getElementById("form01"); formObj.onsubmit = function () { alert("动态注册提交被拦截") return false;//想要不拦截直接提交成功就改成true } } </script>
JavaScript中的dom元素的使用
Document HTML标签对象模型 -- 就是用一个类将页面内的标签进行统计管理 模拟注册条件设置比较 doucument.getelementbyid/getelementbyName 方法只能在页面加载完成之后才能够进行查询
Javascript正则表达式的使用
<head> <meta charset="UTF-8"> <title>js_06-正则表达式对象REGEXP</title> <script type="text/javascript"> var patt = new RegExp("h");//表示字符串中是否包含“h” var guu = /a{3}/ var fft = /^\w{3,5}$/ var str = "aaabch"; var dde = "aaa" // alert(patt.test(str)) // alert(guu.test(str)) alert(fft.test(dde)) </script> </head>
JavaScript往页面中添加元素
<head> <meta charset="UTF-8"> <title>js_07-JavaScript在页面添加元素内容</title> <script type="text/javascript"> <!-- 这些语句必须在页面加载完成后才能够添加内容不然就会显示appendChild中的内容无法找到--> window.onload = function () { var creatediv = document.createElement("div") var createObj = document.createTextNode("简直妙极了") creatediv.appendChild(createObj) document.body.appendChild(creatediv) } </script>
JavaWeb--Servlet
Servlet是JavaWeb的三大组件之一,是用来处理浏览器和服务器之间的数据传输和参数获取等工作的。
Servlet程序可以通过实现Servlet类来创建新的Servlet,也可以通过继承HttpServlet程序来创建Servlet程序
Servlet的生命周期
实现Servlet类实现,在实现Servlet类创建Serlvet后,要实现它的三个方法,init()在服务器启动时被调用生成Servlet对象,service()是在servlet被访问时会被调用,destory()是Servlet被销毁或服务器关闭时会被调用,这也是Servlet的生命周期
SerlvetConfig可以用来获取servlet的init-param参数,这个参数是在servlet的配置文件内部设置的
init-param参数是key-value形式的,name对应value值
<servlet>
<servlet-name>HelloServlet2</servlet-name>
<servlet-class>ccr.servlet.HelloServlet2</servlet-class>
<init-param>
<param-name>username</param-name>
<param-value>Mr_qing</param-value>
</init-param>
<init-param>
<param-name>url</param-name>
<param-value>http://localhost:mysql:3306/test</param-value>
</init-param>
</servlet>
public class HelloServlet2 implements Servlet {
@Override
public void init(ServletConfig servletConfig) throws ServletException {
System.out.println("初始化");
// 使用servletConfig对象的方法时直接对象名调用就可以使用
// servlet程序是在第一次访问时创建,servletConfig对象是在每创建一个servlet时都会生成。
// 在继承了Httpservlet类的类中也能使用servletConfig方法,但是如果想在那个类中使用init()方法就要使用super方法重新调用
System.out.println("servletconfig对象获取servelt-name值:"+ servletConfig.getServletName());
System.out.println("servletconfig对象获取servletContext对象的值:"+ servletConfig.getServletContext());
System.out.println("servletconfig对象获取init-param参数值:"+ servletConfig.getInitParameter("username"));
System.out.println("servletconfig对象获取init-param参数值:"+ servletConfig.getInitParameter("url"));
}
@Override
public ServletConfig getServletConfig() {
return null;
}
@Override
public void service(ServletRequest servletRequest, ServletResponse servletResponse) throws ServletException, IOException {
System.out.println("hello");
}
@Override
public String getServletInfo() {
return null;
}
@Override
public void destroy() {
}
}
ServletContext的使用
servletContext可以获取web.xml文件中的init-param参数,这个参数是name=value形式的,通过getInitParameter( name )方法获取value值
<context-param>
<param-name>username</param-name>
<param-value>Ms_jin</param-value>
</context-param>
<context-param>
<param-name>root</param-name>
<param-value>fan</param-value>
</context-param>
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
// 在使用ServletContext对象时通过ServletConfig对象调用它
javax.servlet.ServletContext context = getServletConfig().getServletContext();
System.out.println("context.getInitParameter(\"username\") = " + context.getInitParameter("usern