笔记-JavaWeb学习之旅16
增强对象的功能
动态代理：在内存中形成代理类
实现步骤：
- 代理对象和真实对象实现相同的接口
- 代理对象 = Proxy.newProxyInstance();
- 使用代理对象调用真实对象的方法
- 增强方法
增强方式：
- 增强参数列表
- 增强返回值类型
- 增强方法体执行逻辑
package com.data.proxy;
//实现动态代理需要真实对象和代理对象具有相同的接口
//定义一个卖电脑的接口
public interface SaleComputer {
public String sale(double money);
public void show();
}
package com.data.proxy;
//真实类
//真实类对应真实对象，真实对象被代理对象代理，用来增强方法
public class Lenovo implements SaleComputer{
@Override
public void show() {
System.out.println("展示电脑....");
}
@Override
public String sale(double money) {
System.out.println("花了"+money+"元买了一台联想电脑");
return "联想电脑";
}
}
package com.data.proxy;
import java.lang.reflect.InvocationHandler;
import java.lang.reflect.Method;
import java.lang.reflect.Proxy;
//增强sale方法演示
public class ProxyTest {
public static void main(String[] args) {
//创建真实对象Lenovo
Lenovo lenovo = new Lenovo();
//获取代理对象
//动态代理增强lenovo对象功能
ClassLoader cl = lenovo.getClass().getClassLoader();//类加载器
Class<?>[] in = lenovo.getClass().getInterfaces();//接口数组
//该方法返回一个代理对象,强制转换为接口类型
SaleComputer proxy_lenovo =(SaleComputer)Proxy.newProxyInstance(cl, in, new InvocationHandler() {//处理器
//代理逻辑编写的方法
//invoke方法特点：代理对象（proxy_lenovo）调用的所有方法都会触发该方法的执行
//参数：
//proxy:代理对象
//method: 代理对象调用的方法，被封装为的对象
//args：代理对象调用方法时，传递的实际参数
@Override
public Object invoke(Object proxy, Method method, Object[] args) throws Throwable {
// System.out.println("你没有调用我，我也执行了.....");
// System.out.println(method.getName());//sale
// System.out.println(args[0]);//8000.0
//使用真实对象调用方法
Object obj = method.invoke(lenovo,args);
return obj;
}
});
//使用代理对象调用方法
String computer = proxy_lenovo.sale(8000);//花了8000.0元买了一台联想电脑
System.out.println(computer);//联想电脑
}
}
JQuery 基础：
概念：一个JavaScript框架
JQuery对象和JS对象区别于装换
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>JQuer对象和js对象的转换</title>
<script src="js/jquery-3.3.1.min.js"></script>
</head>
<body>
<div id="div1">div1....</div>
<div id="div2">div2....</div>
<script>
//通过js方式获取html元素对象
var divs = document.getElementsByTagName("div");
alert(divs.length);//2:可以将其当数组使用
//对divs中所有的div 让其标签体的内容变成aaa，使用js方式
for(var i = 0;i<divs.length;i++){
//divs[i].innerHTML="aaa";//把数组的i索引变成aaa
//js对象转jq对象,$(js对象)
$(divs[i]).html("ccc");
}
//js对象转jq对象
//==========================================================
//通过jq方式获取div元素对象
var $divs=$("div");
// alert($divs.length);//2:可以将其当数组使用
// //对$divs中所有的div 让其标签体的内容变成bbb,使用jq方式
// $divs.html("bbb");
//jq对象转js对象；jq对象[索引]或者jq对象.get(索引)
$divs[0].innerHTML="ddd";
</script>
</body>
</html>
选择器：基本语法
事件绑定，入口函数，样式控制
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="js/jquery-3.3.1.min.js"></script>
<!--//jq入口函数，dom文档加载完成后执行该函数-->
<script>
//绑定单击事件,获取按钮的id
//jq里面有click方法，方法接收一个函数对象
$(function(){//入口函数
$("#b1").click(function () {//事件绑定
alert("abc")
})
});
$(function () {
$("#div1").css("backgroundColor","red");// 样式控制
});
</script>
</head>
<body>
<div id="div1">div1</div>
<div id="div2">div2</div>
<input type="button" value="点我" id="b1">
</body>
</html>
基本选择器
标签选择器 $("html标签名")： 获得所有匹配标签名称的元素
id选择器 $("#id的属性值")：获得与指定id属性值匹配的元素
类选择器 $(".class的属性值"):获得与指定的class属性值匹配的元素
并集选择器 $("选择器1，选择器2...")获取多个选择器选中的所有元素
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>基本选择器</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script src="js/jquery-3.3.1.min.js"></script>
<style type="text/css">
div,span{
width: 180px;
height: 180px;
margin: 20px;
background: #9999CC;
border: #000 1px solid;
float:left;
font-size: 17px;
font-family:Roman;
}
div .mini{
width: 50px;
height: 50px;
background: #CC66FF;
border: #000 1px solid;
font-size: 12px;
font-family:Roman;
}
div .mini01{
width: 50px;
height: 50px;
background: #CC66FF;
border: #000 1px solid;
font-size: 12px;
font-family:Roman;
}
</style>
<script type="text/javascript">
//先使用类id选择器绑定按钮button,在依据要求来选择适当的选择器
$(function () {
// value="改变 id 为 one 的元素的背景色为 红色" id="b1"/>
$(function(){
//id选择器,绑定单击事件
$("#b1").click(function(){
//获取one属性值，点击按钮对应资源变成红色，
$("#one").css("backgroundColor","red");
});
});
// < value=" 改变元素名为 <div> 的所有元素的背景色为 红色" id="b2"/>
$(function(){
//使用id选择器，获取元素
$("#b2").click(function(){
//使用标签选择器，获取元素
$("div").css("backgroundColor","red");
});
// value=" 改变 class 为 mini 的所有元素的背景色为 红色" id="b3"/>
$(function(){
$("#b3").click(function(){
//使用类选择器
$(".mini").css("backgroundColor","red");
});
// value=" 改变所有的<span>元素和 id 为 two 的元素的背景色为红色" id="b4"/>
$(function(){
$("#b4").click(function(){
//使用并集选择器
$("span,#two").css("backgroundColor","red");
});
});
});
});
});
</script>
</head>
<body>
<input type="button" value="保存" class="mini" name="ok" class="mini" />
<input type="button" value="改变 id 为 one 的元素的背景色为 红色" id="b1"/>
<input type="button" value=" 改变元素名为 <div> 的所有元素的背景色为 红色" id="b2"/>
<input type="button" value=" 改变 class 为 mini 的所有元素的背景色为 红色" id="b3"/>
<input type="button" value=" 改变所有的<span>元素和 id 为 two 的元素的背景色为红色" id="b4"/>
<h1>有一种奇迹叫坚持</h1>
<h2>自信源于努力</h2>
<div id="one">
id为one
</div>
<div id="two" class="mini" >
id为two class是 mini
<div class="mini" >class是 mini</div>
</div>
<div class="one" >
class是 one
<div class="mini" >class是 mini</div>
<div class="mini" >class是 mini</div>
</div>
<div class="one" >
class是 one
<div class="mini01" >class是 mini01</div>
<div class="mini" >class是 mini</div>
</div>
<span class="spanone">class为spanone的span元素</span>
<span class="mini">class为mini的span元素</span>
<input type="text" value="zhang" id="username" name="username">
</body>
</html>
层级选择器
后代选择器 $("A B ") 选择A元素内部的所有B元素
子选择器 $("A > B") 选择A元素内部的所有B子元素（只包含子元素，不包含sunzi）
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>层次选择器</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script src="js/jquery-3.3.1.min.js"></script>
<style type="text/css">
div,span{
width: 180px;
height: 180px;
margin: 20px;
background: #9999CC;
border: #000 1px solid;
float:left;
font-size: 17px;
font-family:Roman;
}
div .mini{
width: 50px;
height: 50px;
background: #CC66FF;
border: #000 1px solid;
font-size: 12px;
font-family:Roman;
}
div .mini01{
width: 50px;
height: 50px;
background: #CC66FF;
border: #000 1px solid;
font-size: 12px;
font-family:Roman;
}
</style>
<script type="text/javascript">
$(function () {
//<input type="button" value=" 改变 <body> 内所有 <div> 的背景色为红色" id="b1"/>
//绑定单击按钮，一单击就执行函数
$("#b1").click(function () {
//使用后代选择器
$("body div").css("backgroundColor","red");
});
//<input type="button" value=" 改变 <body> 内子 <div> 的背景色为 红色" id="b2"/>
//绑定单击按钮，一单击就执行函数
$("#b2").click(function () {
//使用后代选择器
$("body > div").css("backgroundColor","red");
});
});
</script>
</head>
<body>
<input type="button" value="保存" class="mini" name="ok" class="mini" />
<input type="button" value=" 改变 <body> 内所有 <div> 的背景色为红色" id="b1"/>
<input type="button" value=" 改变 <body> 内子 <div> 的背景色为 红色" id="b2"/>
<h1>有一种奇迹叫坚持</h1>
<h2>自信源于努力</h2>
<div id="one">
id为one
</div>
<div id="two" class="mini" >
id为two class是 mini
<div class="mini" >class是 mini</div>
</div>
<div class="one" >
class是 one
<div class="mini" >class是 mini</div>
<div class="mini" >class是 mini</div>
</div>
<div class="one">
class是 one
<div class="mini01" >class是 mini01</div>
<div class="mini" >class是 mini</div>
</div>
<span class="spanone"> span
</span>
</body>
</html>
属性选择器
1.属性名称选择器 $("A[属性名]")包含指定属性等于指定值得选择器
2.属性选择器 $("A[属性名='值']")包含指定属性等于指定值的选择器
3.复合属性选择器 $("A[属性名='值'] []...")包含多个属性条件的选择器
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>属性过滤选择器</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script src="js/jquery-3.3.1.min.js"></script>
<style type="text/css">
div,span{
width: 180px;
height: 180px;
margin: 20px;
background: #9999CC;
border: #000 1px solid;
float:left;
font-size: 17px;
font-family:Roman;
}
div .mini{
width: 50px;
height: 50px;
background: #CC66FF;
border: #000 1px solid;
font-size: 12px;
font-family:Roman;
}
div .mini01{
width: 50px;
height: 50px;
background: #CC66FF;
border: #000 1px solid;
font-size: 12px;
font-family:Roman;
}
div.visible{
display:none;
}
</style>
<script type="text/javascript">
$(function () {
// <input type="button" value=" 含有属性title 的div元素背景色为红色" id="b1"/>
$("#b1").click(function(){
$("div[title]").css("backgroundColor","red");
})
// <input type="button" value=" 属性title值等于test的div元素背景色为红色" id="b2"/>
$("#b2").click(function(){
$("div[title='test']").css("backgroundColor","red");
})
// <input type="button" value=" 属性title值不等于test的div元素(没有属性title的也将被选中)背景色为红色" id="b3"/>
$("#b3").click(function(){
$("div[title!='test']").css("backgroundColor","red");
})
// <input type="button" value=" 属性title值 以te开始 的div元素背景色为红色" id="b4"/>
$("#b4").click(function(){
$("div[title^='te']").css("backgroundColor","red");
})
// <input type="button" value=" 属性title值 以est结束 的div元素背景色为红色" id="b5"/>
$("#b5").click(function(){
$("div[title$='est']").css("backgroundColor","red");
})
// <input type="button" value="属性title值 含有es的div元素背景色为红色" id="b6"/>
$("#b6").click(function(){
$("div[title*='es']").css("backgroundColor","red");
})
// <input type="button" value="选取有属性id的div元素，然后在结果中选取属性title值含有“es”的 div 元素背景色为红色" id="b7"/>
$("#b7").click(function(){
$("div[id][title*='es']").css("backgroundColor","red");
})
});
</script>
</head>
<body>
<input type="button" value="保存" class="mini" name="ok" class="mini" />
<input type="button" value=" 含有属性title 的div元素背景色为红色" id="b1"/>
<input type="button" value=" 属性title值等于test的div元素背景色为红色" id="b2"/>
<input type="button" value=" 属性title值不等于test的div元素(没有属性title的也将被选中)背景色为红色" id="b3"/>
<input type="button" value=" 属性title值 以te开始 的div元素背景色为红色" id="b4"/>
<input type="button" value=" 属性title值 以est结束 的div元素背景色为红色" id="b5"/>
<input type="button" value="属性title值 含有es的div元素背景色为红色" id="b6"/>
<input type="button" value="选取有属性id的div元素，然后在结果中选取属性title值含有“es”的 div 元素背景色为红色" id="b7"/>
<div id="one">
id为one div
</div>
<div id="two" class="mini" title="test">
id为two class是 mini div title="test"
<div class="mini" >class是 mini</div>
</div>
<div class="visible" >
class是 one
<div class="mini" >class是 mini</div>
<div class="mini" >class是 mini</div>
</div>
<div class="one" title="test02">
class是 one title="test02"
<div class="mini01" >class是 mini01</div>
<div class="mini" style="margin-top:0px;">class是 mini</div>
</div>
<div class="visible" >
这是隐藏的
</div>
<div class="one">
</div>
<div id="mover" >
动画
</div>
<input type="text" value="zhang" id="username" name="username">
</body>
</html>
笔记-JavaWeb学习之旅16的更多相关文章
- 笔记-JavaWeb学习之旅7
JavaScript基础 概念:一门客户端脚本语言,运行在客户端浏览器中,每一个浏览器都有JavaScript的解析引擎,是一个脚本语言,不需要编译,直接就可以被浏览器解析执行. JavaScript ...
- 笔记-JavaWeb学习之旅5
CP30的演示 package cn.itcast.datasourcejdbc; import com.mchange.v2.c3p0.ComboPooledDataSource; import j ...
- 笔记-JavaWeb学习之旅13
验证码案列 昨天晚上出现的500错误原因在于验证码没有获取到,获取验证码是应该获取的是共享域中的验证码,而我把获取值得键给写成了jsp中的键,而不是内存生成图片中,然后把图片上传到共享域中的键.这两个 ...
- 笔记-JavaWeb学习之旅19
Redis:redis是一款高性能的NOSQL系列的非关系型数据库 NOSQL: Not Only SQL ,意即"不仅仅是SQL",是一项全新的数据库理念,泛指非关系型数据库 r ...
- 笔记-JavaWeb学习之旅18
AJAX:ASynchronous JavaScript And XML 异步的JavaScript 和XML 异步和同步:客户端和服务器端相互通信的基础上 同步:客户端操作后必须等待服务器端的响应, ...
- 笔记-JavaWeb学习之旅17
1.过滤选择器 首元素选择器:first 获得选择的元素中的第一个元素 尾元素选择器:last获得选择元素中的最后一个元素 非元素选择器:not(selector) 不包括指定内容的元素 偶数选择器: ...
- 笔记-JavaWeb学习之旅15
Filter:过滤器 概念:当访问服务器的资源是,过滤器可以将请求拦截下来,完成一些特殊的功能 快速入门: 步骤: 定义一个类,实现接口Filter 复写方法 配置拦截路径 package com.d ...
- 笔记-JavaWeb学习之旅14
JSTL:JavaServer Pages Tag Library JSP标准标签库 if标签 <%@ page import="java.util.ArrayList" % ...
- 笔记-JavaWeb学习之旅10
Servlet server applet运行在服务器端的小程序,servlet就是一个接口,定义了Java类被浏览器访问到的规则(Java类重写这个接口,就可以被浏览器(tomcat)识别) Ser ...
随机推荐
- Java基础知识整理之static修饰属性
static 关键字,我们在开发用的还是比较多的.在<Java编程思想>有下面一段话 static 方法就是没有 this 的方法.在 static 方法内部不能调用非静态方法,反过来是可 ...
- SDUT OJ类型转换函数的应用
题目描述 处理一个复数与一个double数相加的运算,结果存放在一个double型变量d1中,输出d1的值.定义Complex(复数)类,在成员函数中包含重载类型转换运算符:operator doub ...
- LightOJ - 1151 Snakes and Ladders —— 期望、高斯消元法
题目链接:https://vjudge.net/problem/LightOJ-1151 1151 - Snakes and Ladders PDF (English) Statistics F ...
- 版本名称SNAPSHOT、alpha、beta、release、GA含义
Alpha:是内部测试版,一般不向外部发布,会有很多Bug.一般只有测试人员使用.Beta:也是测试版,这个阶段的版本会一直加入新的功能.在Alpha版之后推出.RC:(Release Candida ...
- 打造vim成类source insight
一.Ubuntu14.04下配置 1.配置vimrc文件 输入:version课查看vimrc文件及位置: system vimrc file: "$VIM/vimrc" user ...
- 轻量级RPC框架开发
nio和传统io之间工作机制的差别 自定义rpc框架的设计思路 rpc框架的代码运行流程 第2天 轻量级RPC框架开发 今天内容安排: 1.掌握RPC原理 2.掌握nio操作 3.掌握netty简单的 ...
- BZOJ 1207 [HNOI2004]打鼹鼠：dp【类似最长上升子序列】
题目链接:http://www.lydsy.com/JudgeOnline/problem.php?id=1207 题意: 有一个n*n的网格,接下来一段时间内会有m只鼹鼠出现. 第i只鼹鼠会在tim ...
- android自定义控件(一) 官方文档的翻译
构建自定义组件 Android中,你的应用程序程序与View类组件有着一种固定的联系,例如按钮(Button).文本框(TextView),可编辑文本框(EditText),列表框(ListView) ...
- 洛谷 P4336 黑暗前的幻想乡 —— 容斥+矩阵树定理
题目:https://www.luogu.org/problemnew/show/P4336 当作考试题了,然而没想出来,呵呵. 其实不是二分图完美匹配方案数,而是矩阵树定理+容斥... 就是先放上所 ...
- TreeView滚动TreeViewItem
今天帮忙修了一个bug, 在拖动TreeViewItem时,需要滚动TreeView向前翻页,或向后翻页. 思路: 1.找到TreeView控件里的ItemsControl 2.找到ItemsCont ...