Wolf-Z

HTML

文章目录

HTML
- HTML(view)
- - 标签：<关键字属性="值">
  - 表单（form）
  - - HTML常见属性
    - frameset框架
  - 在一个网页中呈现另一个网页
- CSS(层叠样式表Cascade Style Sheet)
- - 分类：
  - 样式共用
  - 字体、背景、文本...
  - 链接
  - 定位与浮动
  - - CSS position 属性
  - 图片处理
- js(JavaScript特效)
- - 变量类型
  - 数组
  - 字符串
  - - 将字符串包装为链接
  - 运算符
  - - 比较运算符：
    - 对象运算符
  - 语法
  - 函数
  - 类和对象
  - 事件：种类和绑定
  - form表单
  - 浏览器对象模型（Browser Object Model）
  - 时间
  - DOM:Document Object Model文档对象模型
  - - 通过DOM选择对象
    - 用流书写HTML
    - .html元素中的HTML
    - .css
    - 动态绑定方法
    - 用下拉列表选择图片滤镜
    - 利用document提交表单
    - 动态创建标签

HTML

JavaScript 是脚本语言。浏览器会在读取代码时，逐行地执行脚本代码。而对于传统编程来说，会在执行前对所有代码进行编译。
http://www.w3school.com.cn/
HTML：超文本标记语言（HyperText Markup Language）
xml dhtml(包含动画) jsp、PHP(动态的 )

HTML(view)

后缀为.htm和.html
标签不能交叉


	
		首页
	
	
		Hello World

字面值：书写什么就是什么别写单词

标签：<关键字属性=“值”>

1、< hr color=“blue” width=“100%” >一条横线
2、< br/ >换行符
3、< font color=“blue” size=“1~7 +N -N”>Hello< /font>
4、< b >加粗< /b >
5、< i >斜体< /i >
6、< u >下划线< /u >
7、< hn >标题< /hn > n:1~6
8、2< sup >4< /sup > 2的四次方
9、H< sub >2O 水的书写
10、< strong > < s >中划线< /s > < blink >闪烁< /blink >
11、& nbsp;代表空格
12、&的代表&+amp;
13、<代表小于 > 代表大于
14、商标注册：& reg; R+圆圈 & copt; C+圆圈 & trade; 小写的TM & quot; 双引号
15、< p style=“background-color:red”>默认前后各空一行
16、< div style=“background-color:blue”>层块< /div>
17、< ul> < li>无序列表< li>< /ul> < ol>有序列表< /ol>


		四大名著
			西游记
			红楼梦
			水浒传
			三国演义
		
	
	
	
		四大名著
			西游记
			红楼梦

18、图片：< img src=“绝对地址或相对地址” style=“width:400px;” align=“center/top/buttom”/>
19、align 属性：水平体积的html和文字组合的时候，三个取值：top center buttom
20、valign 属性：垂直三个取值：left middle right
21、链接：< a href=“目的URL” target="_blank">在一个新的空白页打开< /a>
22、同一网页回到顶部

锚点

回到顶部

23、背景设置：< body bgcolor=""/background=“图片地址”>
24、表格：
属性：border:边框 align 水平方式 cellpadding 内边距
cellspacing 外边距


	
		第一行加粗

合并单元格


	两列合为一列
	两行合为一行

表单（form）

输入属性

拥有获取用户录入信息的HTML元素




form



	
		表单+表单元素
	
	
		
			
				项目
				内容
			
			
			
				姓名:
				
			
			
				密码:
				
			
			
			
				性别:
				男: 女:
				
			
			
			
				爱好:
				篮球: 足球: 健身:
				
			
			
			
				地址:
				
			
			
			
				备注:

HTML常见属性

表单元素全是通过name值传递信息的get传值多个信息用&连接
input name(别名) value（要获取的值） id(唯一)
size=“1”（一个单位长度）maxLength=“最长字符” readonly只读
单选框 name一致 value不同
下拉菜单 name、value选中选项的值 size下拉列表展示的行数

frameset框架

将浏览器分割，用不同的网页填充
rows 上下切割
cols 左右切割
切割方式 rows/cols(rows=“值1，值2，…，*所有剩余”)
frame填充 scrolling=“no” 设置滚动条
noresize 不可拖动，固定大小




frameset


	
		
		
			
			
		
		
	





	
		menu
		
		
			
				
				目录
				诗歌鉴赏
				简历表格

在一个网页中呈现另一个网页


	
</div>
</code></pre> 
  <h3>CSS(层叠样式表Cascade Style Sheet)</h3> 
  <ul> 
   <li>< font size color></li> 
  </ul> 
  <h4>分类：</h4> 
  <ul> 
   <li>位置：<br> 1、行内样式表：标签/元素上 style=“样式属性1：值1；…”<br> 2、内嵌样式表：写在head里 创建< style>< /style>可以写注释/**/<br> 3、外联样式表：创建一个css文件，将样式文件引入到目标页面</li> 
  </ul> 
  <pre><code><head>
<link rel="stylesheet" type="text/css" href="mystyle.css" />
</head>
</code></pre> 
  <p><mark>行内>>内嵌/外联，内嵌/外联 就近原则</mark></p> 
  <pre><code><html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>frameset</title>
<style>
	#div1{
			color:blue;font-size:60px;
		}
	
	</style>
	<link rel="stylesheet" type="text/css" href="cs.css" />
</head>
<body>
	<font color="blue" align="right" size="6">
		西安工业大学  敦德励学、知行相长
	</font>
	<div style="color:red;font-size:50px;">
		西安工业大学  敦德励学、知行相长
	</div>
	<div id="div1">
		西安工业大学  敦德励学、知行相长
	</div>
	<div id="div2">
		西安工业大学  敦德励学、知行相长
	</div>
</body>

</html>
</code></pre> 
  <pre><code>#div2{
		color:#c0cf0f;
		font-size:30px;
	}
</code></pre> 
  <ul> 
   <li>类型：<br> 1、id 通过id来访问标签，改变标签样式 #id值 来访问<br> 2、类 .class值 来访问<br> 3、标签 标签名 来访问<br> id>>类>>标签</li> 
  </ul> 
  <pre><code><style>
	#div1{
			color:blue;font-size:60px;
	}
	.d{
		color:red;font-size:60px;
	}
	div{
		color:green;font-size:60px;
	}
</style>
</code></pre> 
  <h4>样式共用</h4> 
  <ul> 
   <li>并列使用，将一个样式作用在多个标签上</li> 
   <li>包含使用空格隔开</li> 
  </ul> 
  <pre><code><style>
	#div1{
			color:blue;font-size:30px;
	}
	.d{
		color:red;font-size:60px;
	}
	#div1,.d p{
		color:#00ffff;
	}
</style>
</code></pre> 
  <h4>字体、背景、文本…</h4> 
  <p>http://www.w3school.com.cn/css/css_background.asp</p> 
  <pre><code><style>
	#div1{
			color:blue;
			font-size:60px;
			font-family:Sans-serif;
			font-weight:60px;
			font-variant:small-caps;
	}
	#div2{
			color:blue;
			font-size:80px;
			font-family:Cursive;
			font-weight:60px;
			font-style:italic;
			font-variant:small-caps;
	}
	#div3{
			color:blue;
			font-size:100px;
			font-family:Monospace;
			font-weight:60px;
			font-style:oblique;
			font-variant:small-caps;
	}
	body{
		background-image: url(E:/BaiduNetdiskDownload/我的图片/296473.jpg);
		background-repeat:no-repeat;
		background-position:50%;
		background-attachment:fixed;
		}
</style>
</code></pre> 
  <h4>链接</h4> 
  <ul> 
   <li>链接的四种状态：（顺序不能变）<br> a:link - 普通的、未被访问的链接<br> a:visited - 用户已访问的链接<br> a:hover - 鼠标指针位于链接的上方<br> a:active - 链接被点击的时刻</li> 
  </ul> 
  <h4>定位与浮动</h4> 
  <ul> 
   <li>CSS 为定位和浮动提供了一些属性，利用这些属性，可以建立列式布局，将布局的一部分与另一部分重叠，还可以完成多年来通常需要使用多个表格才能完成的任务。</li> 
   <li>CSS 有三种基本的定位机制：普通流、浮动和绝对定位。</li> 
  </ul> 
  <h5>CSS position 属性</h5> 
  <ul> 
   <li>static ：元素框正常生成。块级元素生成一个矩形框，作为文档流的一部分，行内元素则会创建一个或多个行框，置于其父元素中。</li> 
   <li>relative ：元素框偏移某个距离。元素仍保持其未定位前的形状，它原本所占的空间仍保留。</li> 
   <li>absolute:元素框从文档流完全删除，并相对于其包含块定位。包含块可能是文档中的另一个元素或者是初始包含块。元素原先在正常文档流中所占的空间会关闭，就好像元素原来不存在一样。元素定位后生成一个块级框，而不论原来它在正常流中生成何种类型的框。</li> 
   <li>fixed:元素框的表现类似于将 position 设置为 absolute，不过其包含块是视窗本身。</li> 
  </ul> 
  <pre><code><html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>div-js</title>
	<style>
		#div1{
				position:relative;
				left:200px;
			}
		#div2{
				position:absolute;//元素原先在正常文档流中所占的空间会关闭，就好像元素原来不存在一样
				left:200px;
			}
		#div3{
				position:fixed;
				left:200px;
			}
		</style>
</head>
<body>
	<div id="div1" align="center">
		<p>你好啊，你好啊你好啊你好啊你好啊你好啊</p>
	</div>
	<div id="div2" align="center">
		<p>你好啊，你好啊你好啊你好啊你好啊你好啊</p>
	</div>
	<br>
	<div id="div3" align="center">
		<p>你好啊，你好啊你好啊你好啊你好啊你好啊</p>
	</div>
</body>
</html>
</code></pre> 
  <h4>图片处理</h4> 
  <pre><code><html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>photo</title>
	<style>
	
		#main{
			width:1200px;
			height:260px;
			margin:70px 200px;
		}
		div.show{
				float:left;
				width:350px;
				height:auto;
				border:1px solid #333333;
				padding:30px;
			}
		#img1{
				-webkit-filter:saturate(800%);
			}
		#img1:hover{
				-webkit-filter:saturate(100%);
			}
		#img2{
				-webkit-filter:grayscale(100%);
			}	
		#img2:hover{
				-webkit-filter:grayscale(0%);
			}
		#img3{
				-webkit-filter:drop-shadow(8px 8px 10px red);
			}	
		#img3:hover{
				-webkit-filter:drop-shadow(0px 0px 0px red);
			}
		#img4{
				-webkit-filter:invert(100%);
			}	
		#img4:hover{
				-webkit-filter:invert(0%);
			}
		div.desc{
				text-align:center;
				color:blue;
				
			}
		</style>
</head>
<body>
<div id="main">
	<div id="div1" class="show">
		<img id="img1" src="photo.jpg" width="300px"/>
		<div class="desc">色调加深</div>
	</div>
	<div id="div2" class="show">
		<img id="img2" src="photo.jpg" width="300px"/>
		<div class="desc">灰度</div>
	</div>
	<div id="div3" class="show">
		<img id="img3" src="photo.jpg" width="300px"/>
		<div class="desc">阴影</div>
	</div>
	<div id="div4" class="show">
		<img id="img4" src="photo.jpg" width="300px"/>
		<div class="desc">位素翻转</div>
	</div>
</div>
</body>
</html>
</code></pre> 
  <h3>js(JavaScript特效)</h3> 
  <ul> 
   <li>Java和JavaScript的区别<br> 1、js客户端脚本 Java客户端语言<br> 2、基于对象 Java面向对象<br> 3、Java编译执行 js解释执行<br> 4、Java强语言 js弱语言</li> 
   <li>js组成：核心（core）、DOM（文本对象） BOM（浏览器对象）</li> 
   <li>写法：<br> 1、写在head里 页面内容加载之前<br> 2、写在body里 写在哪在哪加载<br> 3、js文件</li> 
  </ul> 
  <pre><code>document.write("Hello");//js文件内容
</code></pre> 
  <pre><code><script type="text/javascript" src="js.js"></script>
</code></pre> 
  <h4>变量类型</h4> 
  <ul> 
   <li>Undefined 这个值表示变量不含有值。</li> 
   <li>可以通过将变量的值设置为 null 来清空变量。</li> 
  </ul> 
  <pre><code>var carname=new String;
var x=      new Number;
var y=      new Boolean;
var cars=   new Array;
var person= new Object;
</code></pre> 
  <h4>数组</h4> 
  <ul> 
   <li>数组内容可以由不同类型组成</li> 
  </ul> 
  <pre><code><html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>div-js</title>
	
</head>
<body>
	<script type="text/javascript" src="js.js"></script>
	<script>
		var nums=[2,"ss","true"];
		document.write("<br>"+"数组内容："+nums+"<br>");
		var num1="a"+nums[0];
		document.write("数字转字符："+num1+" "+typeof(num1)+"<br>");
		var num2=2+true;
		document.write("Boolean转数字："+num2+" "+typeof(num2)+"<br>");
		var num3=parseInt(nums[1]);
		document.write("将字符转数字："+num3+" "+typeof(num3)+"<br>");//NaN  not a number
		document.write("数组越界："+nums[10]+"<br>");//undefined
		nums.length=0;//清空数组
		document.write("清空数组之后："+nums[2]+"<br>");
		
		</script>
</body>
</html>
</code></pre> 
  <h4>字符串</h4> 
  <pre><code><html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>divs</title>
</head>
<body>
	<script>
		var str="afafae-DWDWF-324cv";
		document.write("字符长度为："+str.length+"<br>");
		document.write("使用big函数："+str.big()+"<br>");//字号增大
		document.write("使用bold函数："+str.bold()+"<br>");//变粗
		document.write("使用italics函数："+str.italics()+"<br>");//斜体
		document.write("使用strike函数："+str.strike()+"<br>");//删除
		document.write("使用函数："+str.italics().big().bold()+"<br>");
		document.write("大写转化："+str.toUpperCase()+"<br>");
		document.write("第三个："+str.charAt(2)+"<br>");
		document.write("找字符af："+str.indexOf("af")+"<br>");
		document.write("找字符af："+str.lastIndexOf("af")+"<br>");
		//分割
		var strs=str.split("-");
		document.write("分割之后的数组："+strs+"<br>");
		//截取
		document.write("从第三个往后（不包含）"+str.substr(3)+"<br>");
		document.write("从第三个往后（不包含）"+str.substring(3)+"<br>");
		document.write("从第三个往后4个（不包含）"+str.substr(3,4)+"<br>");
		document.write("从第三个到4个（左闭右开）"+str.substring(3,4)+"<br>");
		
		</script>
</body>
</html>
</code></pre> 
  <h5>将字符串包装为链接</h5> 
  <pre><code>var x="baidu".link("https://www.baidu.com");
		document.write(x);
</code></pre> 
  <h4>运算符</h4> 
  <h5>比较运算符：</h5> 
  <table> 
   <thead> 
    <tr> 
     <th>字符</th> 
     <th>含义</th> 
    </tr> 
   </thead> 
   <tbody> 
    <tr> 
     <td>></td> 
     <td>大于</td> 
    </tr> 
    <tr> 
     <td><</td> 
     <td>小于</td> 
    </tr> 
    <tr> 
     <td><=</td> 
     <td>小于等于</td> 
    </tr> 
    <tr> 
     <td>>=</td> 
     <td>大于等于</td> 
    </tr> 
    <tr> 
     <td>==</td> 
     <td>等于</td> 
    </tr> 
    <tr> 
     <td>!=</td> 
     <td>不等于</td> 
    </tr> 
    <tr> 
     <td>===</td> 
     <td>恒等（判断数据类型）</td> 
    </tr> 
    <tr> 
     <td>!==</td> 
     <td>恒不等</td> 
    </tr> 
   </tbody> 
  </table> 
  <p>==注意：js里对真假界定宽泛，记住假值：0 false null undefined NaN(not a number) “”(空字符串)</p> 
  <h5>对象运算符</h5> 
  <p>instanceof 检测一个对象 是不是某个类的对象</p> 
  <pre><code><script>
		var x="sdaf";//不能认定为String类型
		var x1=new String("sa");
		var num=new Number(3);
		if(x instanceof String){
			document.write("Hello");
			}
			if(x1 instanceof String){
			document.write("字符串<br>");
			}
			if(num instanceof Number){
			document.write("数字");
			}
		</script>
</code></pre> 
  <h4>语法</h4> 
  <pre><code><html>
	<head>
		<title>script用法</title>
	</head>
	<body>
		<script>
			var ss=true;
			if(ss){
				document.write("真"+"<br>");
			}else{
				document.write("假"+"<br>");
				}
			var str=4;
			switch(str){
				case 1:
					document.write("电视机"+"<br>");
					break;
				case 2:
					document.write("音响"+"<br>");
					break;
				case 3:
					document.write("冰箱"+"<br>");
					break;
				default:
					document.write("电脑"+"<br>");
					break;
				}
				//循环
				var index=0;
				while(index<4){
					document.write("hello"+index+"<br>");
					index++;
				}
				//输入对话框  有返回值 
				var d=prompt("请输入你需要的：","黄瓜");
				document.write(d);
				var s=alert(d);//信息提示框无返回值
				alert(s);
				var f=(3>2)?"是的":false;
				document.write("<font size='7' color='blue'>"+f+"</font>");
			</script>
	</body>
</html>
</code></pre> 
  <h4>函数</h4> 
  <ul> 
   <li>函数提高代码的复用性</li> 
   <li>基本使用：函数封装了一段可重复代码</li> 
   <li>必有返回值：不写return返回值为undefined 函数调用时实参与形参不一致</li> 
   <li>函数无重载：后面的声明会覆盖前面的声明，函数里声明的参数都存放在arguments里</li> 
   <li>高级使用：在js里，函数也是数据类型，声明函数时，创造了function对象，对象名就是函数名</li> 
   <li>作为类的构造 如果调用时用new 代表该函数是构造函数</li> 
   <li>function 方法名(参数列表){<br> 执行语句；<br> 返回值；<br> }</li> 
  </ul> 
  <pre><code><html>
	<head>
		<title>script用法</title>
		<script>
			function test(){
				alert("信息提示。。。");
			}
			function get(){
					return "Hello";
			}
			
			function test2(){
					alert(get());
			}
			function show(obj){
					alert(obj.innerHTML);//当前标签下的所有 标签+文本
					obj.innerHTML="<font color='blue' size='8'>新增内容。。。</font>";
				}
		</script>
		<style>
			#div1{
					width:400px;
					height:300px;
					background-color:red;
				}
			
			</style>
	</head>
	<body "test2()"><!--onload表示页面加载时-->
		<div "show(this)" id="div1">
			<p>激动的很</p>
		</div>
	</body>
</html>
</code></pre> 
  <h4>类和对象</h4> 
  <ul> 
   <li>将一组相关数据和操作封装起来，只使用对象：var 对象名=newObject();</li> 
   <li>通过Json格式字符串创建对象</li> 
  </ul> 
  <pre><code><html>
	<head>
		<title>对象用法</title>
	</head>
	<body >
		<h1>普通</h1>
		<script>
			var stu=new Object();
			stu.name="zhangrui";
			stu.age=22;
			stu.hobbys=["足球","篮球"];
			stu.showMe=function(){
				return this.name;
			}
			alert(stu.showMe());
		</script>
		
		
		<h2>Json</h2>
		<script>
			var stu_json={
					name:"张瑞",
					age:23,
					hobby:["A","B","C"],
					showMe:function(){
							return this.name;
						}
				}
				alert(stu_json.showMe());
		</script>
			
	</body>
</html>
</code></pre> 
  <h4>事件：种类和绑定</h4> 
  <ul> 
   <li>绑定方法：HTML上 脚本上</li> 
   <li>事件分类：<br> 1、body onload事件，页面加载触发<br> 2、鼠标事件：onclick(单击) ondblclick(双击) onmousedown/onmouseup(鼠标按/松) onmouseover/onmouseout/onmousemove移入/移出/移动<br> 3、键盘事件：onkeydown/onkeyup 按下、松开 通过keycode得到编号 onkeypress得到编号的值<br> 4、HTML元素事件：<br> onfocus:得到焦点<br> onblur:失去焦点<br> onchange:值改变 适用< select><br> form:onsubmit 表单提交事件 需要返回 返回值（Boolean）</li> 
  </ul> 
  <h4>form表单</h4> 
  <ul> 
   <li>页面</li> 
  </ul> 
  <pre><code><html>
	<head>
		<title>form表单</title>
	<link rel="stylesheet" type="text/css" href="form3.css" />
	<script src="form3.js"></script>
	</head>
	<body >
		<div id="main">
		<form action="OK.html" method="post" "return confirm()"/>
			<table>
				<tr>
					<td class="t1">姓名：</td>
					<td class="t2">
						<input type="text" name="user" class="input1"/>
						<div id="userTip" class="tip">
							*请输入1-8个字符
						</div>
					</td>
				</tr>
				<tr>
					<td class="t1">密码：</td>
					<td class="t2">
						<input type="password" name="password" class="input1"/>
						<div id="passTip" class="tip">
							*请输入8-16个字符
						</div>
					</td>
				</tr>
				<tr>
					<td class="t1">性别：</td>
					<td class="t2">
						男<input type="radio" name="sex" value="man" checked/>
						女<input type="radio" name="sex" value="woman"/>
					</td>
				</tr>
				<tr>
					<td class="t1">地址：</td>
					<td class="t2">
						<select id="address">
							<option>--西安--</option>
							<option>--咸阳--</option>
							<option>--宝鸡--</option>
							<option>--渭南--</option>
						</select>
					</td>
				</tr>
				<tr>
					<td class="t1">爱好：</td>
					<td class="t2">
						足球<input type="checkbox" name="hobby" value="足球"/>
						篮球<input type="checkbox" name="hobby" value="篮球"/>
						乒乓球<input type="checkbox" name="hobby" value="乒乓球"/>
						羽毛球<input type="checkbox" name="hobby" value="羽毛球"/>
					</td>
				</tr>
				<tr>
					<td colspan="2">
					<input type="submit" value="提  交"/>
				</td>
				</tr>
			</table>
		</form>
	</div>
	</body>
</html>
</code></pre> 
  <ul> 
   <li>js文件</li> 
  </ul> 
  <pre><code>{var flag=false;
function submit(){
	var str=document.getElementsByName("user");
	var pass=document.getElementsByName("password");
	var hobby=document.getElementsByName("hobby");
	var objuser=document.getElementById("userTip");
	if(str[0].value.length==0||str[0].value.length>8){
		objuser.style.color="red";
		objuser.innerHTML="*请输入1-8个字符的名字";
		flag=false;
	}else{
		objuser.style.color="blue";
		objuser.innerHTML="*请输入1-8个字符";
		flag=true;
	}
	var objpass=document.getElementById("passTip");
	if(pass[0].value.length<8||pass[0].value.length>16){
		
		objpass.style.color="red";
		objpass.innerHTML="*请输入8-16字符的密码";
		flag=false;
	}else{
		objpass.style.color="blue";
		objpass.innerHTML="*请输入8-16字符";
		flag=true;
	}
	/*遍历hobby*/
	flag=false;
	for(var i=0;i<hobby.length;i++){
		if(hobby[i].checked){
			flag=true;	
		}
	}
	if(flag==false){
		alert("至少选一个爱好！");	
	}
}
function confirm(){
		submit();
		return flag;
	}
}
</code></pre> 
  <ul> 
   <li>css文件</li> 
  </ul> 
  <pre><code>#main{
		position:absolute;
		top:150px;
		left:400px;
	}
table{
	font-family: cursive;
	font-weight:bold;
	text-align:center;
	letter-spacing:10px;
	width:600px;
	border-collapse:collapse;
}
.input1{
	width:320px;
	height:30px;
	float:left;
	}
.tip{
	letter-spacing:0px;
	color:blue;
	float:left;
	}
tr td{
		height:35px;
		border:1px solid blue;
}
.t1{/*第一列*/
	text-align:right;
	
	}
.t2{/*第二列*/
	text-align:left;
}
#address{
		width:100px;
		height:30px;
		
	}
</code></pre> 
  <h4>浏览器对象模型（Browser Object Model）</h4> 
  <ul> 
   <li>window:顶级对象，属于自己的特权：访问该对象的时候不需要使用window.<br> 1、窗体方法：<br> 1）alert() 2)confirm() 3)prompt()<br> 2、定时器<br> 1）名字=setTimeout(‘方法/执行语句’，时间毫秒数)经过x毫秒发生一次<br> 2）名字=setInterval(‘方法/执行语句’，时间毫秒数)每经过x毫秒发生一次<br> 3）clearTimeout(名字) 清除发生一次的定时器<br> 4）clearInterval(名字) 清除发生多次的定时器<br> 3、窗口操作<br> //当前浏览器可视宽度<br> var w=window.innerWidth<br> || document.documentElement.clientWidth<br> || document.body.clientWidth;<br> //当前浏览器可是高度<br> var h=window.innerHeight<br> || document.documentElement.clientHeight<br> || document.body.clientHeight;</li> 
  </ul> 
  <p>screen.availWidth//浏览器可用宽度<br> screen.availHeight//浏览器可用高度<br> 大小：resizeTo(宽，高) resizeBy(宽，高)<br> 改变坐标：moveTo(x,y) moveBy(x,y);<br> close();//关闭当前<br> open();//打开新窗口</p> 
  <pre><code><html>
	<head>
		<title>
			定时器
		</title>
		<script>
			function getTime(){
				var t=new Date();
				var obj=document.getElementById("div2");
				obj.innerHTML=t;
			}
			
			function showTime(){
				show();
				s=setInterval("getTime()",1000);	
			}
			function stopTime(){
				clearInterval(s);
			}
			function show(){
				var w=window.innerWidth
				|| document.documentElement.clientWidth
				|| document.body.clientWidth;

				var h=window.innerHeight
				|| document.documentElement.clientHeight
				|| document.body.clientHeight;
				var div3=document.getElementById("div3");
				div3.innerHTML="当前宽度："+w+",当前高度："+h+"\n可用宽度："+screen.availWidth+"，可用高度："+screen.availHeight;
				
			}
		</script>
	</head>
	<body>
		<div id="div1">
			<input type="button" value="开始" "showTime()"/>
			<input type="button" value="结束" "stopTime()"/>
		</div>
		<div id="div2">
			
		</div>
		<div id="div3">
			
		</div>
	</body>
</html>
</code></pre> 
  <ul> 
   <li>location：当前页面的地址<br> href:修改该属性页面会发生跳转，可以使用location.assign()重新加载文档<br> 用replace修改返回地址（地址会发生改变），若要让浏览器记录不保存可以使用reload</li> 
   <li>location.hostname 返回 web 主机的域名</li> 
   <li>location.pathname 返回当前页面的路径和文件名</li> 
   <li>location.port 返回 web 主机的端口 （80 或 443）</li> 
   <li>location.protocol 返回所使用的 web 协议（http:// 或 https://）</li> 
   <li>History<br> history.back() - 与在浏览器点击后退按钮相同<br> history.forward() - 与在浏览器中点击按钮向前相同</li> 
  </ul> 
  <h4>时间</h4> 
  <p>时间用法</p> 
  <h4>DOM:Document Object Model文档对象模型</h4> 
  <p>属性方法</p> 
  <ul> 
   <li>DOM=document</li> 
  </ul> 
  <h5>通过DOM选择对象</h5> 
  <p>1、通过id找到HTML元素document.getElementById()<br> 2、通过标签名找到HTML元素document.getElementsByName()<br> 3、通过类名找到HTML元素document.getElementsByTagName()</p> 
  <h5>用流书写HTML</h5> 
  <pre><code><div id="div1">
			<script>
				document.write(Date());
			</script>

			内容
</div>
</code></pre> 
  <h5>.html元素中的HTML</h5> 
  <pre><code><html>
	<head>
		<title>
			document
		</title>
		<script>
			function change(){
					<!--根据id获取标签元素-->
					var div3=document.getElementById("div3");
					div3.innerHTML="<p style='background-color:blue;font-size:20px'>重要内容</p>";
				}
				function change2(){
					var ft=document.getElementById("ft");
					//改变标签属性
					ft.color="green";
					ft.size="20px";
				}
		</script>
		<style type="text/css">
  		div{
  			background-color: gray;
  			height:200px;
  			width:200px;
  			border-style: outset;
  			margin:10px;
  			float:left;
  		}
		</style>
	</head>
	<body>
		<div id="div3">	
		</div>
		<div id="div4">
			<font color="red" size="6" id="ft">
				内容
			</font>
		</div>
			<input type="button" value="变色" "change2()"/>
			<input type="button" value="变化" "change()"/>
	
	</body>
</html>
</code></pre> 
  <h5>.css</h5> 
  <p>标签对象.style.样式名=“值”<br> 标签对象.style.text(不建议)</p> 
  <pre><code><script>
	function select(obj){
			var imgs=document.getElementsByTagName("img");
			for(var i=0;i<imgs.length;i++){
				imgs[i].style.border="1px solid black";
			}
			obj.style.border="5px solid red";
		}
</script>
</code></pre> 
  <h5>动态绑定方法</h5> 
  <pre><code><html>
	<head>
		<title>
		动态绑定
		</title>
	</head>
	<script>
		function change1(){
			var img=document.getElementById("img1");
			var p1=document.getElementById("p1");
			img.style.border="5px solid green";
			p1.innerHTML="再点一下试试";
			img.change2;
		}
		function change2(){
			var img=document.getElementById("img1");
			var p1=document.getElementById("p1");
			img.style.border="5px solid red";
			p1.innerHTML="再点一下^_^";
			img.change1;
		}
	</script>
	<body>
		<div align="center">
			<img id="img1" src="photo.jpg" width="300px" "change1()"/>
			<p id="p1">请点图片</p>
		</div>
	</body>
</html>
</code></pre> 
  <h5>用下拉列表选择图片滤镜</h5> 
  <pre><code>function filter(){
					var img=document.getElementById("img1");//获得图片
					var sele=document.getElementById("sele");//获得下拉菜单
					if(sele.selectedIndex==0){
						img.style.WebkitFilter="invert(100%)";//位素反转
					}else if(sele.selectedIndex==1){
						img.style.WebkitFilter="saturate(800%)";//色调加深
					}else if(sele.selectedIndex==2){
						img.style.WebkitFilter="grayscale(100%)";//灰度
					}else if(sele.selectedIndex==3){
						img.style.WebkitFilter="drop-shadow(8px 8px 10px red)";//阴影
					}
				}
</code></pre> 
  <h5>利用document提交表单</h5> 
  <ul> 
   <li>document.表单名.submit()</li> 
  </ul> 
  <pre><code><html>
	<head>
		<title>document提交表单</title>
		<script>
			function sub(e){
					e.parentNode.submit();
					//document.form1.submit();
				}
		</script>
	</head>
	<body>
		<form action="ok1.html" method="get" name="form1">
			<input type="button" value="提交" "sub(this)"/>
		</form>
		<form action="ok2.html" method="get" name="form2">
			<input type="button" value="提交" "sub(this)"/>
		</form>
	</body>
</html>
</code></pre> 
  <h5>动态创建标签</h5> 
  <p>document属性</p> 
  <pre><code><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>demo2</title>
<script>
	function change1(){
		var div1=document.getElementById("div1");
		var div2=document.getElementById("div2");
		var font1=document.createElement("font");//创建标签元素
		var new_text=document.createTextNode(div1.innerHTML);//创建文本对象
		font1.setAttribute("color","red");//设置属性
		font1.setAttribute("size","6");
		font1.appendChild(new_text);//将目标元素添加到当前元素的子节点
		div2.appendChild(font1);
	}
</script>
</head>
<body>
	<div id="div1">
		hello<br>
		everybody
	</div>
	<input type="button" value="创建" "change1()"/>
	<div id="div2">
	</div>
</body>
</html>
</code></pre> 
 </div> 
</div>
                            </div>
                        </div>
                    </div>
                    <!--PC和WAP自适应版-->
                    <div id="SOHUCS" sid="1716897863914565632"></div>
                    <script type="text/javascript" src="/views/front/js/chanyan.js"></script>
                    <!-- 文章页-底部 动态广告位 -->
                    <div class="youdao-fixed-ad" id="detail_ad_bottom"></div>
                </div>
                <div class="col-md-3">
                    <div class="row" id="ad">
                        <!-- 文章页-右侧1 动态广告位 -->
                        <div id="right-1" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad">
                            <div class="youdao-fixed-ad" id="detail_ad_1"> </div>
                        </div>
                        <!-- 文章页-右侧2 动态广告位 -->
                        <div id="right-2" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad">
                            <div class="youdao-fixed-ad" id="detail_ad_2"></div>
                        </div>
                        <!-- 文章页-右侧3 动态广告位 -->
                        <div id="right-3" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad">
                            <div class="youdao-fixed-ad" id="detail_ad_3"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="container">
        <h4 class="pt20 mb15 mt0 border-top">你可能感兴趣的:(java,web)</h4>
        <div id="paradigm-article-related">
            <div class="recommend-post mb30">
                <ul class="widget-links">
                    <li><a href="/article/1773602697044361216.htm"
                           title="浪潮 M5系列服务器IPMI无法监控存储RAID卡问题." target="_blank">浪潮 M5系列服务器IPMI无法监控存储RAID卡问题.</a>
                        <span class="text-muted">Songxwn</span>
<a class="tag" taget="_blank" href="/search/%E7%A1%AC%E4%BB%B6%E6%9C%8D%E5%8A%A1%E5%99%A8/1.htm">硬件服务器</a><a class="tag" taget="_blank" href="/search/%E6%9C%8D%E5%8A%A1%E5%99%A8/1.htm">服务器</a><a class="tag" taget="_blank" href="/search/%E8%BF%90%E7%BB%B4/1.htm">运维</a>
                        <div>简介浪潮的M5代服务器，可能有WebBMC无法查看存储RAID/SAS卡状态的情况，可以通过以下方式修改。修改完成后重启BMC即可生效。ESXiIPMITools使用：https://songxwn.com/ESXi8_IPMI/（Linux也可以直接使用）Linux/ESXiIPMITool下载：https://songxwn.com/file/ipmitoolWindows下载：https:/</div>
                    </li>
                    <li><a href="/article/1773582305621770240.htm"
                           title="华为OD机试 - 单向链表中间节点（Java & JS & Python & C & C++）" target="_blank">华为OD机试 - 单向链表中间节点（Java & JS & Python & C & C++）</a>
                        <span class="text-muted">华为OD题库</span>
<a class="tag" taget="_blank" href="/search/%E5%8D%8E%E4%B8%BAod/1.htm">华为od</a><a class="tag" taget="_blank" href="/search/%E9%93%BE%E8%A1%A8/1.htm">链表</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a>
                        <div>须知哈喽，本题库完全免费，收费是为了防止被爬，大家订阅专栏后可以私信联系退款。感谢支持文章目录须知题目描述输出描述解析代码题目描述给定一个单链表L，请编写程序输出L中间结点保存的数据。如果有两个中间结点，则输出第二个中间结点保存的数据。例如：给定L为1→7→5，则输出应该为7；给定L为1→2→3→4，则输出应该为3；输入描述每个输入包含1个测试用例。每个测试用例：第一行给出链表首结点的地址、结点总</div>
                    </li>
                    <li><a href="/article/1773578026081124352.htm"
                           title="学习JavaEE的日子 Day32 线程池" target="_blank">学习JavaEE的日子 Day32 线程池</a>
                        <span class="text-muted">A 北枝</span>
<a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0JavaEE/1.htm">学习JavaEE</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a><a class="tag" taget="_blank" href="/search/java-ee/1.htm">java-ee</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E7%BA%BF%E7%A8%8B%E6%B1%A0/1.htm">线程池</a>
                        <div>Day32线程池1.引入一个线程完成一项任务所需时间为：创建线程时间-Time1线程中执行任务的时间-Time2销毁线程时间-Time32.为什么需要线程池(重要)线程池技术正是关注如何缩短或调整Time1和Time3的时间，从而提高程序的性能。项目中可以把Time1，T3分别安排在项目的启动和结束的时间段或者一些空闲的时间段线程池不仅调整Time1，Time3产生的时间段，而且它还显著减少了创建</div>
                    </li>
                    <li><a href="/article/1773510684068347904.htm"
                           title="请简单介绍一下Shiro框架是什么？Shiro在Java安全领域的主要作用是什么？Shiro主要提供了哪些安全功能？" target="_blank">请简单介绍一下Shiro框架是什么？Shiro在Java安全领域的主要作用是什么？Shiro主要提供了哪些安全功能？</a>
                        <span class="text-muted">AaronWang94</span>
<a class="tag" taget="_blank" href="/search/shiro/1.htm">shiro</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E5%AE%89%E5%85%A8/1.htm">安全</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a>
                        <div>请简单介绍一下Shiro框架是什么？Shiro框架是一个强大且灵活的开源安全框架，为Java应用程序提供了全面的安全解决方案。它主要用于身份验证、授权、加密和会话管理等功能，可以轻松地集成到任何JavaWeb应用程序中，并提供了易于理解和使用的API，使开发人员能够快速实现安全特性。Shiro的核心组件包括Subject、SecurityManager和Realms。Subject代表了当前与应用</div>
                    </li>
                    <li><a href="/article/1773504260386914304.htm"
                           title="通俗易懂：什么是Java虚拟机（JVM）？它的主要作用是什么？" target="_blank">通俗易懂：什么是Java虚拟机（JVM）？它的主要作用是什么？</a>
                        <span class="text-muted">大龄下岗程序员</span>
<a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a><a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a>
                        <div>Java虚拟机（JavaVirtualMachine,JVM）是一种软件实现的抽象计算机，它负责执行Java字节码（Bytecode）。Java程序并不是直接在物理计算机上运行，而是先由Java编译器将源代码编译成与平台无关的字节码，然后由JVM负责读取字节码并在实际硬件架构上运行。JVM的主要作用包括以下几个方面：1.跨平台性-JVM是Java语言“一次编写，到处运行”（WriteOnce,Ru</div>
                    </li>
                    <li><a href="/article/1773495574226599936.htm"
                           title="3、JavaWeb-Ajax/Axios-前端工程化-Element" target="_blank">3、JavaWeb-Ajax/Axios-前端工程化-Element</a>
                        <span class="text-muted">所谓远行Misnearch</span>
<a class="tag" taget="_blank" href="/search/%23/1.htm">#</a><a class="tag" taget="_blank" href="/search/JavaWeb/1.htm">JavaWeb</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/ajax/1.htm">ajax</a><a class="tag" taget="_blank" href="/search/elementui/1.htm">elementui</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E6%A1%86%E6%9E%B6/1.htm">前端框架</a>
                        <div>P34Ajax介绍Ajax:AsynchroousJavaScriptAndXML，异步的JS和XMLJS网页动作，XML一种标记语言，存储数据，作用：数据交换：通过Ajax给服务器发送请求，并获取服务器响应的数据异步交互：在不重新加载整个页面的情况下，与服务器交换数据并实现更新部分网页的技术，例如：搜索联想、用户名是否可用的校验等等。同步与异步：同步：服务器在处理中客户端要处于等待状态，输入域名</div>
                    </li>
                    <li><a href="/article/1773495447948689408.htm"
                           title="docker怎么端口映射" target="_blank">docker怎么端口映射</a>
                        <span class="text-muted">Lance_mu</span>
<a class="tag" taget="_blank" href="/search/docker/1.htm">docker</a><a class="tag" taget="_blank" href="/search/%E5%AE%B9%E5%99%A8/1.htm">容器</a><a class="tag" taget="_blank" href="/search/%E8%BF%90%E7%BB%B4/1.htm">运维</a>
                        <div>1、默认固定的端口#Web服务器：WebApache或Nginx通常使用80端口HTTP：80HTTPS：443#数据库服务器MySQL：3306PostgreSQL：5432MongoDB：27017Redis：6379#邮件服务器SMTP：25POP3：110IMAP：143#其他服务SSH：22FTP：21DNS（域名解析）：53代理服务器Squid：3128版本控制系统Git：9418(S</div>
                    </li>
                    <li><a href="/article/1773471029155397632.htm"
                           title="网络安全（黑客）——自学2024" target="_blank">网络安全（黑客）——自学2024</a>
                        <span class="text-muted">小言同学喜欢挖漏洞</span>
<a class="tag" taget="_blank" href="/search/web%E5%AE%89%E5%85%A8/1.htm">web安全</a><a class="tag" taget="_blank" href="/search/%E5%AE%89%E5%85%A8/1.htm">安全</a><a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%BB%9C/1.htm">网络</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a><a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%BB%9C%E5%AE%89%E5%85%A8/1.htm">网络安全</a><a class="tag" taget="_blank" href="/search/%E4%BF%A1%E6%81%AF%E5%AE%89%E5%85%A8/1.htm">信息安全</a><a class="tag" taget="_blank" href="/search/%E6%B8%97%E9%80%8F%E6%B5%8B%E8%AF%95/1.htm">渗透测试</a>
                        <div>01什么是网络安全网络安全可以基于攻击和防御视角来分类，我们经常听到的“红队”、“渗透测试”等就是研究攻击技术，而“蓝队”、“安全运营”、“安全运维”则研究防御技术。无论网络、Web、移动、桌面、云等哪个领域，都有攻与防两面性，例如Web安全技术，既有Web渗透，也有Web防御技术（WAF）。作为一个合格的网络安全工程师，应该做到攻守兼备，毕竟知己知彼，才能百战百胜。02怎样规划网络安全如果你是一</div>
                    </li>
                    <li><a href="/article/1773470776930926592.htm"
                           title="黑客（网络安全）技术自学30天" target="_blank">黑客（网络安全）技术自学30天</a>
                        <span class="text-muted">一个迷人的黑客</span>
<a class="tag" taget="_blank" href="/search/web%E5%AE%89%E5%85%A8/1.htm">web安全</a><a class="tag" taget="_blank" href="/search/%E5%AE%89%E5%85%A8/1.htm">安全</a><a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%BB%9C/1.htm">网络</a><a class="tag" taget="_blank" href="/search/%E7%AC%94%E8%AE%B0/1.htm">笔记</a><a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%BB%9C%E5%AE%89%E5%85%A8/1.htm">网络安全</a><a class="tag" taget="_blank" href="/search/%E4%BF%A1%E6%81%AF%E5%AE%89%E5%85%A8/1.htm">信息安全</a><a class="tag" taget="_blank" href="/search/%E6%B8%97%E9%80%8F%E6%B5%8B%E8%AF%95/1.htm">渗透测试</a>
                        <div>01什么是网络安全网络安全可以基于攻击和防御视角来分类，我们经常听到的“红队”、“渗透测试”等就是研究攻击技术，而“蓝队”、“安全运营”、“安全运维”则研究防御技术。无论网络、Web、移动、桌面、云等哪个领域，都有攻与防两面性，例如Web安全技术，既有Web渗透，也有Web防御技术（WAF）。作为一个合格的网络安全工程师，应该做到攻守兼备，毕竟知己知彼，才能百战百胜。02怎样规划网络安全如果你是一</div>
                    </li>
                    <li><a href="/article/1773436409693143040.htm"
                           title="枚举使用笔记" target="_blank">枚举使用笔记</a>
                        <span class="text-muted">万变不离其宗_8</span>
<a class="tag" taget="_blank" href="/search/%E9%A1%B9%E7%9B%AE%E7%AC%94%E8%AE%B0/1.htm">项目笔记</a><a class="tag" taget="_blank" href="/search/%E7%AC%94%E8%AE%B0/1.htm">笔记</a>
                        <div>1.java枚举怎么放在方法上面的注释里面/***保存*@paramuserId用户id*@paramtype见枚举{@linkcom.common.enums.TypeEnum}*@return*/voidsave(LonguserId,Stringtype);</div>
                    </li>
                    <li><a href="/article/1773408210510741504.htm"
                           title="webpack.prod.js（webpack生产环境配置文件）" target="_blank">webpack.prod.js（webpack生产环境配置文件）</a>
                        <span class="text-muted">门板_</span>
<a class="tag" taget="_blank" href="/search/webpack/1.htm">webpack</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a>
                        <div>生产环境：只打包不运行本地服务器对于在config目录下的webpack.prod.js1.在根目录下运行npxwebpack--config./config/webpack.prod.js2.在package.json文件中配置"build":"npxwebpack--config./config/webpack.prod.js"constpath=require('path')constESL</div>
                    </li>
                    <li><a href="/article/1773403175781466112.htm"
                           title="Python dict字符串转json对象，小数精度丢失问题" target="_blank">Python dict字符串转json对象，小数精度丢失问题</a>
                        <span class="text-muted">朝如青丝 暮成雪</span>
<a class="tag" taget="_blank" href="/search/json/1.htm">json</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</a>
                        <div>一前言JSON(JavaScriptObjectNotation)是一种轻量级的数据交换格式，dict是Python的一种数据格式。本篇介绍一个float数据转换时精度丢失的案例。二问题描述importjsontest_str1='{"π":3.1415926535897932384626433832795028841971}'test_str2='{"value":10.00000}'print</div>
                    </li>
                    <li><a href="/article/1773389331080216576.htm"
                           title="VUE 页面禁止缩放（华为平板浏览器可能失效）" target="_blank">VUE 页面禁止缩放（华为平板浏览器可能失效）</a>
                        <span class="text-muted">唐屁屁儿</span>
<a class="tag" taget="_blank" href="/search/JS/1.htm">JS</a><a class="tag" taget="_blank" href="/search/vue/1.htm">vue</a><a class="tag" taget="_blank" href="/search/webview/1.htm">webview</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a>
                        <div>h5页面移动端禁止缩放、web页面禁止浏览器缩放移动端优先，可禁止用户缩放和双击放大；在App.vue中的script内的方法里加入以下代码：window.onload=function(){document.addEventListener('touchstart',function(event){if(event.touches.length>1){event.preventDefault()</div>
                    </li>
                    <li><a href="/article/1773382031552610304.htm"
                           title="java实体中返回前端的double类型四舍五入（格式化）" target="_blank">java实体中返回前端的double类型四舍五入（格式化）</a>
                        <span class="text-muted">婲落ヽ紅顏誶</span>
<a class="tag" taget="_blank" href="/search/java/1.htm">java</a>
                        <div>根据业务，需要通过后端给前端返回部分double类型的数值，一般需要保留两位小数，使用jackson转换对象packagecom.ruoyi.common.core.config;importcom.fasterxml.jackson.core.JsonGenerator;importcom.fasterxml.jackson.databind.JsonSerializer;importcom.f</div>
                    </li>
                    <li><a href="/article/1773359500359696384.htm"
                           title="Java中HashMap底层数据结构及主要参数?" target="_blank">Java中HashMap底层数据结构及主要参数?</a>
                        <span class="text-muted">山间漫步人生路</span>
<a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E7%BB%93%E6%9E%84/1.htm">数据结构</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a>
                        <div>在Java中，HashMap的底层数据结构主要基于数组和链表，同时在Java8及以后的版本中，当链表长度超过一定阈值时，链表会转换为红黑树来优化性能。这种结构结合了数组和链表的优点，既提供了快速的随机访问，又允许动态地扩展存储桶的大小。HashMap的主要参数包括：初始容量（InitialCapacity）：这是HashMap在创建时设定的桶数组的大小。默认值为16。这个值可以根据预计存储的键值对</div>
                    </li>
                    <li><a href="/article/1773351821931249664.htm"
                           title="Java学习笔记01" target="_blank">Java学习笔记01</a>
                        <span class="text-muted">.wsy.</span>
<a class="tag" taget="_blank" href="/search/%E6%97%A5%E5%B8%B8/1.htm">日常</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a><a class="tag" taget="_blank" href="/search/%E7%AC%94%E8%AE%B0/1.htm">笔记</a>
                        <div>1.1Java简介Java的前身是Oak，詹姆斯·高斯林是java之父。1.2Java体系Java是一种与平台无关的语言，其源代码可以被编译成一种结构中立的中间文件（.class，字节码文件）于Java虚拟机上运行。1.2.3专有名词JDK提供编译、运行Java程序所需要的种种工具及资源。JRE是运行Java所依赖的环境的集合。JVM是一个虚构出来的计算机，通过在实际的计算机上仿真模拟各种计算机功</div>
                    </li>
                    <li><a href="/article/1773347793847517184.htm"
                           title="UNDERSTANDING HTML WITH LARGE LANGUAGE MODELS" target="_blank">UNDERSTANDING HTML WITH LARGE LANGUAGE MODELS</a>
                        <span class="text-muted">liferecords</span>
<a class="tag" taget="_blank" href="/search/LLM/1.htm">LLM</a><a class="tag" taget="_blank" href="/search/%E8%AF%AD%E8%A8%80%E6%A8%A1%E5%9E%8B/1.htm">语言模型</a><a class="tag" taget="_blank" href="/search/%E4%BA%BA%E5%B7%A5%E6%99%BA%E8%83%BD/1.htm">人工智能</a><a class="tag" taget="_blank" href="/search/%E8%87%AA%E7%84%B6%E8%AF%AD%E8%A8%80%E5%A4%84%E7%90%86/1.htm">自然语言处理</a>
                        <div>UNDERSTANDINGHTMLWITHLARGELANGUAGEMODELS相关链接：arXiv关键字：大型语言模型、HTML理解、Web自动化、自然语言处理、机器学习摘要大型语言模型（LLMs）在各种自然语言任务上表现出色。然而，它们在HTML理解方面的能力——即解析网页的原始HTML，对于自动化基于Web的任务、爬取和浏览器辅助检索等应用——尚未被充分探索。我们为HTML理解模型（经过微调</div>
                    </li>
                    <li><a href="/article/1773347164047605760.htm"
                           title="自学黑客（网络安全）技术——2024最新" target="_blank">自学黑客（网络安全）技术——2024最新</a>
                        <span class="text-muted">九九归二</span>
<a class="tag" taget="_blank" href="/search/web%E5%AE%89%E5%85%A8/1.htm">web安全</a><a class="tag" taget="_blank" href="/search/%E5%AE%89%E5%85%A8/1.htm">安全</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a><a class="tag" taget="_blank" href="/search/%E7%AC%94%E8%AE%B0/1.htm">笔记</a><a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%BB%9C/1.htm">网络</a><a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%BB%9C%E5%AE%89%E5%85%A8/1.htm">网络安全</a><a class="tag" taget="_blank" href="/search/%E4%BF%A1%E6%81%AF%E5%AE%89%E5%85%A8/1.htm">信息安全</a>
                        <div>01什么是网络安全网络安全可以基于攻击和防御视角来分类，我们经常听到的“红队”、“渗透测试”等就是研究攻击技术，而“蓝队”、“安全运营”、“安全运维”则研究防御技术。无论网络、Web、移动、桌面、云等哪个领域，都有攻与防两面性，例如Web安全技术，既有Web渗透，也有Web防御技术（WAF）。作为一个合格的网络安全工程师，应该做到攻守兼备，毕竟知己知彼，才能百战百胜。02怎样规划网络安全如果你是一</div>
                    </li>
                    <li><a href="/article/1773344429185236992.htm"
                           title="Webpack构建优化——区分环境" target="_blank">Webpack构建优化——区分环境</a>
                        <span class="text-muted">oWSQo</span>

                        <div>为什么需要区分环境在开发网页的时候，一般都会有多套运行环境，例如：在开发过程中方便开发调试的环境。发布到线上给用户使用的运行环境。这两套不同的环境虽然都是由同一套源代码编译而来，但是代码内容却不一样，差异包括：线上代码被特殊压缩过。开发用的代码包含一些用于提示开发者的提示日志，这些日志普通用户不可能去看它。开发用的代码所连接的后端数据接口地址也可能和线上环境不同，因为要避免开发过程中造成对线上数据</div>
                    </li>
                    <li><a href="/article/1773340995031728128.htm"
                           title="Java回溯知识点（含面试大厂题和源码）" target="_blank">Java回溯知识点（含面试大厂题和源码）</a>
                        <span class="text-muted">一成码农</span>
<a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E9%9D%A2%E8%AF%95/1.htm">面试</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a>
                        <div>回溯算法是一种通过遍历所有可能的候选解来寻找所有解的算法，如果候选解被确认不是一个解（或至少不是最后一个解），回溯算法会通过在上一步进行一些变化来丢弃这个解，即“回溯”并尝试另一个候选解。回溯法通常用递归方法来实现，在解决排列、组合、选择问题时非常有效。回溯算法的核心要点：路径：也就是已经做出的选择。选择列表：也就是你当前可以做的选择。结束条件：也就是到达决策树底层，无法再做出选择的条件。回溯算法</div>
                    </li>
                    <li><a href="/article/1773337745800888320.htm"
                           title="Azkaban各种类型的Job编写" target="_blank">Azkaban各种类型的Job编写</a>
                        <span class="text-muted">__元昊__</span>

                        <div>一、概述原生的Azkaban支持的plugin类型有以下这些：command：Linuxshell命令行任务gobblin：通用数据采集工具hadoopJava：运行hadoopMR任务java：原生java任务hive：支持执行hiveSQLpig：pig脚本任务spark：spark任务hdfsToTeradata：把数据从hdfs导入TeradatateradataToHdfs：把数据从Te</div>
                    </li>
                    <li><a href="/article/1773326395645165568.htm"
                           title="java基础相关面试题详细总结" target="_blank">java基础相关面试题详细总结</a>
                        <span class="text-muted">。。。。。96</span>
<a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a>
                        <div>1.Java中的数据类型有哪些？答：Java中的数据类型包括基本数据类型（如整数、浮点数、字符等）和引用数据类型（如类、接口、数组等）。2.什么是面向对象编程（OOP）？答：面向对象编程是一种编程范式，它将数据和对数据的操作封装在一起，形成对象。通过对象之间的交互来实现程序的功能。3.解释类和对象的关系。答：类是对象的抽象描述，而对象是类的具体实例。一个类可以创建多个对象，每个对象都具有类中定义的</div>
                    </li>
                    <li><a href="/article/1773308900838277120.htm"
                           title="Web前端Html的表单" target="_blank">Web前端Html的表单</a>
                        <span class="text-muted">任家伟</span>
<a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a>
                        <div>表单的关键字：form标签表示一个表单区域action=“后端地址”method=“提交数据方式:get/post”input单行输入框type=“text”文本name=“定义名称名字自定义”向后端提交的键readonly=“readonly”只读，不可修改，但是可以提交disabled=“disabled”禁用组件不可修改，不能提交type=“password”密码框type=“radio”单</div>
                    </li>
                    <li><a href="/article/1773279695408791552.htm"
                           title="Thinkphp - 详细实现网站系统登录功能，附带 Mysql 数据库设置、Web 前端展示界面、信息校验等（详细代码，即设计过程）" target="_blank">Thinkphp - 详细实现网站系统登录功能，附带 Mysql 数据库设置、Web 前端展示界面、信息校验等（详细代码，即设计过程）</a>
                        <span class="text-muted">王佳斌</span>
<a class="tag" taget="_blank" href="/search/%2B/1.htm">+</a><a class="tag" taget="_blank" href="/search/Thinkphp/1.htm">Thinkphp</a><a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E5%BA%93/1.htm">数据库</a>
                        <div>前言登录功能，是我们几乎开发每个系统都必须的模块。登录功能设计思路，主要包括几个方面。用户输入网址展示登录页面用户输入用户名，密码等点击登录进行信息校验校验通过之后，记录用户登录信息，跳转指定页面用户校验失败，提示失败信息页面目录具体功能实现为了快速搭建可用、美观的页面，我们采用一个比较成熟的前端框架Bootstrap。下面我们到Bootstrap的官网Bootsrap官网下载bootstrap。</div>
                    </li>
                    <li><a href="/article/1773256158274977792.htm"
                           title="javascript 日期转换为时间戳，时间戳转换为日期的函数" target="_blank">javascript 日期转换为时间戳，时间戳转换为日期的函数</a>
                        <span class="text-muted">cdcdhj</span>
<a class="tag" taget="_blank" href="/search/javascript%E5%AD%A6%E4%B9%A0%E6%97%A5%E8%AE%B0/1.htm">javascript学习日记</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a><a class="tag" taget="_blank" href="/search/ecmascript/1.htm">ecmascript</a>
                        <div>日期转化为时间戳，主要用valueOf()来进行转化为毫秒时间戳，getTime()IOS系统无法解析转换，所以都有valueOf()letgetTimestampOrDate=function(timestamp){lettimeStamp='';constregex=/^\d{4}(-|\/)\d{2}(-|\/)\d{2}$/;constregex2=/^\d{4}(-|\/)\d{2}(-</div>
                    </li>
                    <li><a href="/article/1773255151038038016.htm"
                           title="Java面试题：解释JVM的内存结构，并描述堆、栈、方法区在内存结构中的角色和作用，Java中的多线程是如何实现的，Java垃圾回收机制的基本原理，并讨论常见的垃圾回收算法" target="_blank">Java面试题：解释JVM的内存结构，并描述堆、栈、方法区在内存结构中的角色和作用，Java中的多线程是如何实现的，Java垃圾回收机制的基本原理，并讨论常见的垃圾回收算法</a>
                        <span class="text-muted">杰哥在此</span>
<a class="tag" taget="_blank" href="/search/Java%E7%B3%BB%E5%88%97/1.htm">Java系列</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/jvm/1.htm">jvm</a><a class="tag" taget="_blank" href="/search/%E7%AE%97%E6%B3%95/1.htm">算法</a><a class="tag" taget="_blank" href="/search/%E9%9D%A2%E8%AF%95/1.htm">面试</a>
                        <div>Java内存模型与多线程的深入探讨在Java的世界里，内存模型和多线程是开发者必须掌握的核心知识点。它们不仅关系到程序的性能和稳定性，还直接影响到系统的可扩展性和可靠性。下面，我将通过三个面试题，带领大家深入理解Java内存模型、多线程以及并发编程的相关原理和实践。面试题一：请解释JVM的内存结构，并描述堆、栈、方法区在内存结构中的角色和作用。关注点：JVM内存结构的基本组成堆、栈、方法区的功能和</div>
                    </li>
                    <li><a href="/article/1773198631940194304.htm"
                           title="COMP315 JavaScript Cloud Computing for E Commerce" target="_blank">COMP315 JavaScript Cloud Computing for E Commerce</a>
                        <span class="text-muted">zhuyu0206girl</span>
<a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a><a class="tag" taget="_blank" href="/search/ecmascript/1.htm">ecmascript</a>
                        <div>Assignment1:Javascript1IntroductionAcommontaskincloudcomputingisdatacleaning,whichistheprocessoftakinganinitialdatasetthatmaycontainerroneousorincompletedata,andremovingorfixingthoseelementsbeforeform</div>
                    </li>
                    <li><a href="/article/1773191331473063936.htm"
                           title="JSON与AJAX：网页交互的利器" target="_blank">JSON与AJAX：网页交互的利器</a>
                        <span class="text-muted">入冉心</span>
<a class="tag" taget="_blank" href="/search/json/1.htm">json</a><a class="tag" taget="_blank" href="/search/ajax/1.htm">ajax</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a>
                        <div>在现代Web开发中，JSON（JavaScriptObjectNotation）和AJAX（AsynchronousJavaScriptandXML）是两项不可或缺的技术。它们共同为网页提供了动态、实时的数据交互能力，为用户带来了更加流畅和丰富的体验。本文将详细介绍JSON和AJAX的概念、原理，并通过代码示例展示它们在实际开发中的应用。一、JSON：轻量级的数据交换格式JSON是一种轻量级的数据</div>
                    </li>
                    <li><a href="/article/1772795036136701952.htm"
                           title="程序员开发技术整理" target="_blank">程序员开发技术整理</a>
                        <span class="text-muted">laizhixue</span>
<a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E6%A1%86%E6%9E%B6/1.htm">前端框架</a>
                        <div>前端技术：vue-前端框架element-前端框架bootstrap-前端框架echarts-图标组件C#后端技术：webservice：soap架构：简单的通信协议，用于服务通信ORM框架：对象关系映射，如EF：对象实体模型，是ado.net中的应用技术soap服务通讯：xml通讯ado.net：OAuth2:登录授权认证：Token认证：JWT：jsonwebtokenJava后端技术：便捷工</div>
                    </li>
                    <li><a href="/article/1772775523957669888.htm"
                           title="centos7 安装influxdb+telegraf+grafana 监控服务器" target="_blank">centos7 安装influxdb+telegraf+grafana 监控服务器</a>
                        <span class="text-muted">吕吕-lvlv</span>
<a class="tag" taget="_blank" href="/search/grafana/1.htm">grafana</a><a class="tag" taget="_blank" href="/search/%E6%9C%8D%E5%8A%A1%E5%99%A8/1.htm">服务器</a><a class="tag" taget="_blank" href="/search/%E8%BF%90%E7%BB%B4/1.htm">运维</a>
                        <div>influxdbinfluxdb是一个时间序列数据库,所有数据记录都会打上时间戳,适合存储数字类型的内容telegraftelegraf可以用于收集系统和服务的统计数据并发送到influxdbgrafanagrafana是一个界面非常漂亮,可直接读取influxdb数据展示成各种图表的开源可视化web软件安装并启动influxdb数据库vim/etc/yum.repos.d/influxdb.re</div>
                    </li>
                                <li><a href="/article/30.htm"
                                       title="Java实现的基于模板的网页结构化信息精准抽取组件：HtmlExtractor" target="_blank">Java实现的基于模板的网页结构化信息精准抽取组件：HtmlExtractor</a>
                                    <span class="text-muted">yangshangchuan</span>
<a class="tag" taget="_blank" href="/search/%E4%BF%A1%E6%81%AF%E6%8A%BD%E5%8F%96/1.htm">信息抽取</a><a class="tag" taget="_blank" href="/search/HtmlExtractor/1.htm">HtmlExtractor</a><a class="tag" taget="_blank" href="/search/%E7%B2%BE%E5%87%86%E6%8A%BD%E5%8F%96/1.htm">精准抽取</a><a class="tag" taget="_blank" href="/search/%E4%BF%A1%E6%81%AF%E9%87%87%E9%9B%86/1.htm">信息采集</a>
                                    <div>HtmlExtractor是一个Java实现的基于模板的网页结构化信息精准抽取组件，本身并不包含爬虫功能，但可被爬虫或其他程序调用以便更精准地对网页结构化信息进行抽取。 
&nbsp;  
HtmlExtractor是为大规模分布式环境设计的，采用主从架构，主节点负责维护抽取规则，从节点向主节点请求抽取规则，当抽取规则发生变化，主节点主动通知从节点，从而能实现抽取规则变化之后的实时动态生效。 
如</div>
                                </li>
                                <li><a href="/article/157.htm"
                                       title="java编程思想 -- 多态" target="_blank">java编程思想 -- 多态</a>
                                    <span class="text-muted">百合不是茶</span>
<a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E5%A4%9A%E6%80%81%E8%AF%A6%E8%A7%A3/1.htm">多态详解</a>
                                    <div>一:&nbsp;向上转型和向下转型 
面向对象中的转型只会发生在有继承关系的子类和父类中（接口的实现也包括在这里）。父类：人&nbsp;&nbsp;&nbsp;&nbsp;子类：男人向上转型：&nbsp;Person&nbsp;p&nbsp;=&nbsp;new&nbsp;Man()&nbsp;;&nbsp;//向上转型不需要强制类型转化向下转型：&nbsp;Man&nbsp;man&nbsp;=</div>
                                </li>
                                <li><a href="/article/284.htm"
                                       title="[自动数据处理]稳扎稳打,逐步形成自有ADP系统体系" target="_blank">[自动数据处理]稳扎稳打,逐步形成自有ADP系统体系</a>
                                    <span class="text-muted">comsci</span>
<a class="tag" taget="_blank" href="/search/dp/1.htm">dp</a>
                                    <div> 
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 对于国内的IT行业来讲,虽然我们已经有了&quot;两弹一星&quot;,在局部领域形成了自己独有的技术特征,并初步摆脱了国外的控制...但是前面的路还很长.... 
 
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 首先是我们的自动数据处理系统还无法处理很多高级工程...中等规模的拓扑分析系统也没有完成,更加复杂的</div>
                                </li>
                                <li><a href="/article/411.htm"
                                       title="storm 自定义 日志文件" target="_blank">storm 自定义 日志文件</a>
                                    <span class="text-muted">商人shang</span>
<a class="tag" taget="_blank" href="/search/storm/1.htm">storm</a><a class="tag" taget="_blank" href="/search/cluster/1.htm">cluster</a><a class="tag" taget="_blank" href="/search/logback/1.htm">logback</a>
                                    <div>Storm中的日志级级别默认为INFO，并且，日志文件是根据worker号来进行区分的，这样，同一个log文件中的信息不一定是一个业务的，这样就会有以下两个需求出现： 
1. 想要进行一些调试信息的输出 
2. 调试信息或者业务日志信息想要输出到一些固定的文件中 
&nbsp; 
不要怕，不要烦恼，其实Storm已经提供了这样的支持，可以通过自定义logback 下的 cluster.xml 来输</div>
                                </li>
                                <li><a href="/article/538.htm"
                                       title="Extjs3 SpringMVC使用 @RequestBody 标签问题记录" target="_blank">Extjs3 SpringMVC使用 @RequestBody 标签问题记录</a>
                                    <span class="text-muted">21jhf</span>

                                    <div>springMVC使用 @RequestBody(required = false) UserVO userInfo 
传递json对象数据，往往会出现http 415，400,500等错误，总结一下需要使用ajax提交json数据才行，ajax提交使用proxy，参数为jsonData，不能为params；另外，需要设置Content-type属性为json，代码如下： 
（由于使用了父类aaa</div>
                                </li>
                                <li><a href="/article/665.htm"
                                       title="一些排错方法" target="_blank">一些排错方法</a>
                                    <span class="text-muted">文强chu</span>
<a class="tag" taget="_blank" href="/search/%E6%96%B9%E6%B3%95/1.htm">方法</a>
                                    <div>1、java.lang.IllegalStateException: Class invariant violation 
at org.apache.log4j.LogManager.getLoggerRepository(LogManager.java:199)at org.apache.log4j.LogManager.getLogger(LogManager.java:228) 
at o</div>
                                </li>
                                <li><a href="/article/792.htm"
                                       title="Swing中文件恢复我觉得很难" target="_blank">Swing中文件恢复我觉得很难</a>
                                    <span class="text-muted">小桔子</span>
<a class="tag" taget="_blank" href="/search/swing/1.htm">swing</a>
                                    <div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 我那个草了！老大怎么回事，怎么做项目评估的？只会说相信你可以做的，试一下，有的是时间！ 
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 用java开发一个图文处理工具，类似word，任意位置插入、拖动、删除图片以及文本等。文本框、流程图等，数据保存数据库，其余可保存pdf格式。ok,姐姐千辛万苦，</div>
                                </li>
                                <li><a href="/article/919.htm"
                                       title="php 文件操作" target="_blank">php 文件操作</a>
                                    <span class="text-muted">aichenglong</span>
<a class="tag" taget="_blank" href="/search/PHP/1.htm">PHP</a><a class="tag" taget="_blank" href="/search/%E8%AF%BB%E5%8F%96%E6%96%87%E4%BB%B6/1.htm">读取文件</a><a class="tag" taget="_blank" href="/search/%E5%86%99%E5%85%A5%E6%96%87%E4%BB%B6/1.htm">写入文件</a>
                                    <div>1 写入文件 
@$fp=fopen(&quot;$DOCUMENT_ROOT/order.txt&quot;, &quot;ab&quot;); 
if(!$fp){ 
 echo &quot;open file error&quot; ; 
 
exit; 
} 
$outputstring=&quot;date:&quot;.&quot; \t tire:&quot;.$tire.&quot</div>
                                </li>
                                <li><a href="/article/1046.htm"
                                       title="MySQL的btree索引和hash索引的区别" target="_blank">MySQL的btree索引和hash索引的区别</a>
                                    <span class="text-muted">AILIKES</span>
<a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E7%BB%93%E6%9E%84/1.htm">数据结构</a><a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a><a class="tag" taget="_blank" href="/search/%E7%AE%97%E6%B3%95/1.htm">算法</a>
                                    <div>Hash 索引结构的特殊性，其 检索效率非常高，索引的检索可以一次定位，不像B-Tree 索引需要从根节点到枝节点，最后才能访问到页节点这样多次的IO访问，所以 Hash 索引的查询效率要远高于 B-Tree 索引。   &nbsp;   &nbsp;   
可能很多人又有疑问了，既然 Hash 索引的效率要比 B-Tree 高很多，为什么大家不都用 Hash 索引而还要使用 B-Tree 索引呢</div>
                                </li>
                                <li><a href="/article/1173.htm"
                                       title="JAVA的抽象--- 接口 --实现" target="_blank">JAVA的抽象--- 接口 --实现</a>
                                    <span class="text-muted">百合不是茶</span>

                                    <div>抽象 接口 实现接口 
&nbsp; 
//抽象 类 ,方法 
&nbsp; 
//定义一个公共抽象的类 ,并在类中定义一个抽象的方法体 
抽象的定义使用abstract 
&nbsp; 
abstract class A 定义一个抽象类 例如： 
//定义一个基类
public abstract class A{ 
&nbsp; 
&nbsp; 
//抽象类不能用来实例化，只能用来继承 
//</div>
                                </li>
                                <li><a href="/article/1300.htm"
                                       title="JS变量作用域实例" target="_blank">JS变量作用域实例</a>
                                    <span class="text-muted">bijian1013</span>
<a class="tag" taget="_blank" href="/search/%E4%BD%9C%E7%94%A8%E5%9F%9F/1.htm">作用域</a>
                                    <div>&lt;script&gt; 
    var scope='hello'; 
    function a(){ 
       console.log(scope);   //undefined 
       var scope='world'; 
       console.log(scope);   //world 
       console.log(b);      </div>
                                </li>
                                <li><a href="/article/1427.htm"
                                       title="TDD实践（二）" target="_blank">TDD实践（二）</a>
                                    <span class="text-muted">bijian1013</span>
<a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/TDD/1.htm">TDD</a>
                                    <div>实践题目：分解质因数 
Step1： 
单元测试： 
package com.bijian.study.factor.test;

import java.util.Arrays;

import junit.framework.Assert;

import org.junit.Before;
import org.junit.Test;

import com.bijian.</div>
                                </li>
                                <li><a href="/article/1554.htm"
                                       title="[MongoDB学习笔记一]MongoDB主从复制" target="_blank">[MongoDB学习笔记一]MongoDB主从复制</a>
                                    <span class="text-muted">bit1129</span>
<a class="tag" taget="_blank" href="/search/mongodb/1.htm">mongodb</a>
                                    <div>MongoDB称为分布式数据库，主要原因是1.基于副本集的数据备份， 2.基于切片的数据扩容。副本集解决数据的读写性能问题，切片解决了MongoDB的数据扩容问题。 
&nbsp; 事实上，MongoDB提供了主从复制和副本复制两种备份方式，在MongoDB的主从复制和副本复制集群环境中，只有一台作为主服务器，另外一台或者多台服务器作为从服务器。   本文介绍MongoDB的主从复制模式，需要指明</div>
                                </li>
                                <li><a href="/article/1681.htm"
                                       title="【HBase五】Java API操作HBase" target="_blank">【HBase五】Java API操作HBase</a>
                                    <span class="text-muted">bit1129</span>
<a class="tag" taget="_blank" href="/search/hbase/1.htm">hbase</a>
                                    <div>import java.io.IOException;

import org.apache.hadoop.conf.Configuration;
import org.apache.hadoop.hbase.HBaseConfiguration;
import org.apache.hadoop.hbase.HColumnDescriptor;
import org.apache.ha</div>
                                </li>
                                <li><a href="/article/1808.htm"
                                       title="python调用zabbix api接口实时展示数据" target="_blank">python调用zabbix api接口实时展示数据</a>
                                    <span class="text-muted">ronin47</span>

                                    <div>zabbix api接口来进行展示。经过思考之后，计划获取如下内容： &nbsp; &nbsp; 1、&nbsp;&nbsp;获得认证密钥 &nbsp; &nbsp; 2、&nbsp;&nbsp;获取zabbix所有的主机组 &nbsp; &nbsp; 3、&nbsp;&nbsp;获取单个组下的所有主机 &nbsp; &nbsp; 4、&nbsp;&nbsp;获取某个主机下的所有监控项 &nbsp</div>
                                </li>
                                <li><a href="/article/1935.htm"
                                       title="jsp取得绝对路径" target="_blank">jsp取得绝对路径</a>
                                    <span class="text-muted">byalias</span>
<a class="tag" taget="_blank" href="/search/%E7%BB%9D%E5%AF%B9%E8%B7%AF%E5%BE%84/1.htm">绝对路径</a>
                                    <div>在JavaWeb开发中，常使用绝对路径的方式来引入JavaScript和CSS文件，这样可以避免因为目录变动导致引入文件找不到的情况，常用的做法如下： 
 
一、使用${pageContext.request.contextPath} 
 
　　代码” ${pageContext.request.contextPath}”的作用是取出部署的应用程序名，这样不管如何部署，所用路径都是正确的。 
 
</div>
                                </li>
                                <li><a href="/article/2062.htm"
                                       title="Java定时任务调度：用ExecutorService取代Timer" target="_blank">Java定时任务调度：用ExecutorService取代Timer</a>
                                    <span class="text-muted">bylijinnan</span>
<a class="tag" taget="_blank" href="/search/java/1.htm">java</a>
                                    <div>《Java并发编程实战》一书提到的用ExecutorService取代Java Timer有几个理由，我认为其中最重要的理由是： 
如果TimerTask抛出未检查的异常，Timer将会产生无法预料的行为。Timer线程并不捕获异常，所以 TimerTask抛出的未检查的异常会终止timer线程。这种情况下，Timer也不会再重新恢复线程的执行了;它错误的认为整个Timer都被取消了。此时，已经被</div>
                                </li>
                                <li><a href="/article/2189.htm"
                                       title="SQL 优化原则" target="_blank">SQL 优化原则</a>
                                    <span class="text-muted">chicony</span>
<a class="tag" taget="_blank" href="/search/sql/1.htm">sql</a>
                                    <div>  
一、问题的提出 
　在应用系统开发初期，由于开发数据库数据比较少，对于查询SQL语句，复杂视图的的编写等体会不出SQL语句各种写法的性能优劣，但是如果将应用系统提交实际应用后，随着数据库中数据的增加，系统的响应速度就成为目前系统需要解决的最主要的问题之一。系统优化中一个很重要的方面就是SQL语句的优化。对于海量数据，劣质SQL语句和优质SQL语句之间的速度差别可以达到上百倍，可见对于一个系统</div>
                                </li>
                                <li><a href="/article/2316.htm"
                                       title="java 线程弹球小游戏" target="_blank">java 线程弹球小游戏</a>
                                    <span class="text-muted">CrazyMizzz</span>
<a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E6%B8%B8%E6%88%8F/1.htm">游戏</a>
                                    <div>最近java学到线程，于是做了一个线程弹球的小游戏，不过还没完善 
 
 这里是提纲 
 1.线程弹球游戏实现 
 1.实现界面需要使用哪些API类 
 JFrame 
 JPanel 
 JButton 
 FlowLayout 
 Graphics2D 
 Thread 
 Color 
 ActionListener 
 ActionEvent 
 MouseListener 
 Mouse</div>
                                </li>
                                <li><a href="/article/2443.htm"
                                       title="hadoop jps出现process information unavailable提示解决办法" target="_blank">hadoop jps出现process information unavailable提示解决办法</a>
                                    <span class="text-muted">daizj</span>
<a class="tag" taget="_blank" href="/search/hadoop/1.htm">hadoop</a><a class="tag" taget="_blank" href="/search/jps/1.htm">jps</a>
                                    <div>hadoop jps出现process information unavailable提示解决办法  &nbsp;    
jps时出现如下信息： 
3019 -- process information unavailable3053 -- process information unavailable2985 -- process information unavailable2917 -- </div>
                                </li>
                                <li><a href="/article/2570.htm"
                                       title="PHP图片水印缩放类实现" target="_blank">PHP图片水印缩放类实现</a>
                                    <span class="text-muted">dcj3sjt126com</span>
<a class="tag" taget="_blank" href="/search/PHP/1.htm">PHP</a>
                                    <div>  
&lt;?php
class Image{

	private $path;


	function __construct($path='./'){
		$this-&gt;path=rtrim($path,'/').'/';
	}

	//水印函数，参数：背景图，水印图，位置，前缀,TMD透明度

	public function water($b,$l,$pos</div>
                                </li>
                                <li><a href="/article/2697.htm"
                                       title="IOS控件学习：UILabel常用属性与用法" target="_blank">IOS控件学习：UILabel常用属性与用法</a>
                                    <span class="text-muted">dcj3sjt126com</span>
<a class="tag" taget="_blank" href="/search/ios/1.htm">ios</a><a class="tag" taget="_blank" href="/search/UILabel/1.htm">UILabel</a>
                                    <div>参考网站： 
http://shijue.me/show_text/521c396a8ddf876566000007 
http://www.tuicool.com/articles/zquENb 
http://blog.csdn.net/a451493485/article/details/9454695 
http://wiki.eoe.cn/page/iOS_pptl_artile_281</div>
                                </li>
                                <li><a href="/article/2824.htm"
                                       title="完全手动建立maven骨架" target="_blank">完全手动建立maven骨架</a>
                                    <span class="text-muted">eksliang</span>
<a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/eclipse/1.htm">eclipse</a><a class="tag" taget="_blank" href="/search/Web/1.htm">Web</a>
                                    <div>建一个 JAVA 项目 ： 
mvn archetype:create 
-DgroupId=com.demo 
-DartifactId=App 
[-Dversion=0.0.1-SNAPSHOT] 
[-Dpackaging=jar] 
 
 
建一个 web 项目 ： 
mvn archetype:create 
-DgroupId=com.demo 
-DartifactId=web-a</div>
                                </li>
                                <li><a href="/article/2951.htm"
                                       title="配置清单" target="_blank">配置清单</a>
                                    <span class="text-muted">gengzg</span>
<a class="tag" taget="_blank" href="/search/%E9%85%8D%E7%BD%AE/1.htm">配置</a>
                                    <div>1、修改grub启动的内核版本
vi /boot/grub/grub.conf
将default 0改为1

拷贝mt7601Usta.ko到/lib文件夹

拷贝RT2870STA.dat到 /etc/Wireless/RT2870STA/文件夹

拷贝wifiscan到bin文件夹，chmod 775 /bin/wifiscan
拷贝wifiget.sh到bin文件夹，chm</div>
                                </li>
                                <li><a href="/article/3078.htm"
                                       title="Windows端口被占用处理方法" target="_blank">Windows端口被占用处理方法</a>
                                    <span class="text-muted">huqiji</span>
<a class="tag" taget="_blank" href="/search/windows/1.htm">windows</a>
                                    <div>以下文章主要以80端口号为例，如果想知道其他的端口号也可以使用该方法..........................1、在windows下如何查看80端口占用情况?是被哪个进程占用?如何终止等.&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 这里主要是用到windows下的DOS工具,点击&quot;开始&quot;--&quot;运行&quot;,输入&</div>
                                </li>
                                <li><a href="/article/3205.htm"
                                       title="开源ckplayer 网页播放器， 跨平台(html5, mobile)，flv, f4v, mp4, rtmp协议. webm, ogg, m3u8 ！" target="_blank">开源ckplayer 网页播放器， 跨平台(html5, mobile)，flv, f4v, mp4, rtmp协议. webm, ogg, m3u8 ！</a>
                                    <span class="text-muted">天梯梦</span>
<a class="tag" taget="_blank" href="/search/mobile/1.htm">mobile</a>
                                    <div>CKplayer，其全称为超酷flv播放器，它是一款用于网页上播放视频的软件，支持的格式有：http协议上的flv,f4v,mp4格式，同时支持rtmp视频流格 式播放，此播放器的特点在于用户可以自己定义播放器的风格，诸如播放/暂停按钮，静音按钮，全屏按钮都是以外部图片接口形式调用，用户根据自己的需要制作 出播放器风格所需要使用的各个按钮图片然后替换掉原始风格里相应的图片就可以制作出自己的风格了，</div>
                                </li>
                                <li><a href="/article/3332.htm"
                                       title="简单工厂设计模式" target="_blank">简单工厂设计模式</a>
                                    <span class="text-muted">hm4123660</span>
<a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E5%B7%A5%E5%8E%82%E8%AE%BE%E8%AE%A1%E6%A8%A1%E5%BC%8F/1.htm">工厂设计模式</a><a class="tag" taget="_blank" href="/search/%E7%AE%80%E5%8D%95%E5%B7%A5%E5%8E%82%E6%A8%A1%E5%BC%8F/1.htm">简单工厂模式</a>
                                    <div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 简单工厂模式（Simple Factory Pattern）属于类的创新型模式，又叫静态工厂方法模式。是通过专门定义一个类来负责创建其他类的实例，被创建的实例通常都具有共同的父类。简单工厂模式是由一个工厂对象决定创建出哪一种产品类的实例。简单工厂模式是工厂模式家族中最简单实用的模式，可以理解为是不同工厂模式的一个特殊实现。 </div>
                                </li>
                                <li><a href="/article/3459.htm"
                                       title="maven笔记" target="_blank">maven笔记</a>
                                    <span class="text-muted">zhb8015</span>
<a class="tag" taget="_blank" href="/search/maven/1.htm">maven</a>
                                    <div>跳过测试阶段： 
mvn package -DskipTests 
临时性跳过测试代码的编译： 
mvn package -Dmaven.test.skip=true 
&nbsp; 
maven.test.skip同时控制maven-compiler-plugin和maven-surefire-plugin两个插件的行为，即跳过编译，又跳过测试。 
&nbsp; 
指定测试类 
mvn test</div>
                                </li>
                                <li><a href="/article/3586.htm"
                                       title="非mapreduce生成Hfile，然后导入hbase当中" target="_blank">非mapreduce生成Hfile，然后导入hbase当中</a>
                                    <span class="text-muted">Stark_Summer</span>
<a class="tag" taget="_blank" href="/search/map/1.htm">map</a><a class="tag" taget="_blank" href="/search/hbase/1.htm">hbase</a><a class="tag" taget="_blank" href="/search/reduce/1.htm">reduce</a><a class="tag" taget="_blank" href="/search/Hfile/1.htm">Hfile</a><a class="tag" taget="_blank" href="/search/path%E5%AE%9E%E4%BE%8B/1.htm">path实例</a>
                                    <div>最近一个群友的boss让研究hbase，让hbase的入库速度达到5w+/s，这可愁死了，4台个人电脑组成的集群，多线程入库调了好久，速度也才1w左右，都没有达到理想的那种速度，然后就想到了这种方式，但是网上多是用mapreduce来实现入库，而现在的需求是实时入库，不生成文件了，所以就只能自己用代码实现了，但是网上查了很多资料都没有查到，最后在一个网友的指引下，看了源码，最后找到了生成Hfile</div>
                                </li>
                                <li><a href="/article/3713.htm"
                                       title="jsp web tomcat 编码问题" target="_blank">jsp web tomcat 编码问题</a>
                                    <span class="text-muted">王新春</span>
<a class="tag" taget="_blank" href="/search/tomcat/1.htm">tomcat</a><a class="tag" taget="_blank" href="/search/jsp/1.htm">jsp</a><a class="tag" taget="_blank" href="/search/pageEncode/1.htm">pageEncode</a>
                                    <div>今天配置jsp项目在tomcat上，windows上正常，而linux上显示乱码，最后定位原因为tomcat 的server.xml 文件的配置，添加 URIEncoding 属性： 
 
 

      &lt;Connector port=&quot;8080&quot; protocol=&quot;HTTP/1.1&quot; 
               connectionTi</div>
                                </li>
                </ul>
            </div>
        </div>
    </div>

<div>
    <div class="container">
        <div class="indexes">
            <strong>按字母分类：</strong>
            <a href="/tags/A/1.htm" target="_blank">A</a><a href="/tags/B/1.htm" target="_blank">B</a><a href="/tags/C/1.htm" target="_blank">C</a><a
                href="/tags/D/1.htm" target="_blank">D</a><a href="/tags/E/1.htm" target="_blank">E</a><a href="/tags/F/1.htm" target="_blank">F</a><a
                href="/tags/G/1.htm" target="_blank">G</a><a href="/tags/H/1.htm" target="_blank">H</a><a href="/tags/I/1.htm" target="_blank">I</a><a
                href="/tags/J/1.htm" target="_blank">J</a><a href="/tags/K/1.htm" target="_blank">K</a><a href="/tags/L/1.htm" target="_blank">L</a><a
                href="/tags/M/1.htm" target="_blank">M</a><a href="/tags/N/1.htm" target="_blank">N</a><a href="/tags/O/1.htm" target="_blank">O</a><a
                href="/tags/P/1.htm" target="_blank">P</a><a href="/tags/Q/1.htm" target="_blank">Q</a><a href="/tags/R/1.htm" target="_blank">R</a><a
                href="/tags/S/1.htm" target="_blank">S</a><a href="/tags/T/1.htm" target="_blank">T</a><a href="/tags/U/1.htm" target="_blank">U</a><a
                href="/tags/V/1.htm" target="_blank">V</a><a href="/tags/W/1.htm" target="_blank">W</a><a href="/tags/X/1.htm" target="_blank">X</a><a
                href="/tags/Y/1.htm" target="_blank">Y</a><a href="/tags/Z/1.htm" target="_blank">Z</a><a href="/tags/0/1.htm" target="_blank">其他</a>
        </div>
    </div>
</div>
<footer id="footer" class="mb30 mt30">
    <div class="container">
        <div class="footBglm">
            <a target="_blank" href="/">首页</a> -
            <a target="_blank" href="/custom/about.htm">关于我们</a> -
            <a target="_blank" href="/search/Java/1.htm">站内搜索</a> -
            <a target="_blank" href="/sitemap.txt">Sitemap</a> -
            <a target="_blank" href="/custom/delete.htm">侵权投诉</a>
        </div>
        <div class="copyright">版权所有 IT知识库 CopyRight © 2000-2050 E-COM-NET.COM , All Rights Reserved.
<!--            <a href="https://beian.miit.gov.cn/" rel="nofollow" target="_blank">京ICP备09083238号</a><br>-->
        </div>
    </div>
</footer>
<!-- 代码高亮 -->
<script type="text/javascript" src="/static/syntaxhighlighter/scripts/shCore.js"></script>
<script type="text/javascript" src="/static/syntaxhighlighter/scripts/shLegacy.js"></script>
<script type="text/javascript" src="/static/syntaxhighlighter/scripts/shAutoloader.js"></script>
<link type="text/css" rel="stylesheet" href="/static/syntaxhighlighter/styles/shCoreDefault.css"/>
<script type="text/javascript" src="/static/syntaxhighlighter/src/my_start_1.js"></script>





</body>

</html>