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/1835511912843014144.htm"
                           title="理解Gunicorn：Python WSGI服务器的基石" target="_blank">理解Gunicorn：Python WSGI服务器的基石</a>
                        <span class="text-muted">范范0825</span>
<a class="tag" taget="_blank" href="/search/ipython/1.htm">ipython</a><a class="tag" taget="_blank" href="/search/linux/1.htm">linux</a><a class="tag" taget="_blank" href="/search/%E8%BF%90%E7%BB%B4/1.htm">运维</a>
                        <div>理解Gunicorn：PythonWSGI服务器的基石介绍Gunicorn，全称GreenUnicorn，是一个为PythonWSGI（WebServerGatewayInterface）应用设计的高效、轻量级HTTP服务器。作为PythonWeb应用部署的常用工具，Gunicorn以其高性能和易用性著称。本文将介绍Gunicorn的基本概念、安装和配置，帮助初学者快速上手。1.什么是Gunico</div>
                    </li>
                    <li><a href="/article/1835509897106649088.htm"
                           title="Long类型前后端数据不一致" target="_blank">Long类型前后端数据不一致</a>
                        <span class="text-muted">igotyback</span>
<a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a>
                        <div>响应给前端的数据浏览器控制台中response中看到的Long类型的数据是正常的到前端数据不一致前后端数据类型不匹配是一个常见问题，尤其是当后端使用Java的Long类型（64位）与前端JavaScript的Number类型（最大安全整数为2^53-1，即16位）进行数据交互时，很容易出现精度丢失的问题。这是因为JavaScript中的Number类型无法安全地表示超过16位的整数。为了解决这个问</div>
                    </li>
                    <li><a href="/article/1835509769822105600.htm"
                           title="LocalDateTime 转 String" target="_blank">LocalDateTime 转 String</a>
                        <span class="text-muted">igotyback</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>importjava.time.LocalDateTime;importjava.time.format.DateTimeFormatter;publicclassMain{publicstaticvoidmain(String[]args){//获取当前时间LocalDateTimenow=LocalDateTime.now();//定义日期格式化器DateTimeFormatterformat</div>
                    </li>
                    <li><a href="/article/1835509391361667072.htm"
                           title="Linux下QT开发的动态库界面弹出操作（SDL2）" target="_blank">Linux下QT开发的动态库界面弹出操作（SDL2）</a>
                        <span class="text-muted">13jjyao</span>
<a class="tag" taget="_blank" href="/search/QT%E7%B1%BB/1.htm">QT类</a><a class="tag" taget="_blank" href="/search/qt/1.htm">qt</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/sdl2/1.htm">sdl2</a><a class="tag" taget="_blank" href="/search/linux/1.htm">linux</a>
                        <div>需求：操作系统为linux，开发框架为qt，做成需带界面的qt动态库，调用方为java等非qt程序难点：调用方为java等非qt程序，也就是说调用方肯定不带QApplication::exec()，缺少了这个，QTimer等事件和QT创建的窗口将不能弹出(包括opencv也是不能弹出)；这与qt调用本身qt库是有本质的区别的思路：1.调用方缺QApplication::exec()，那么我们在接口</div>
                    </li>
                    <li><a href="/article/1835504218178416640.htm"
                           title="Google earth studio 简介" target="_blank">Google earth studio 简介</a>
                        <span class="text-muted">陟彼高冈yu</span>
<a class="tag" taget="_blank" href="/search/%E6%97%85%E6%B8%B8/1.htm">旅游</a>
                        <div>GoogleEarthStudio是一个基于Web的动画工具，专为创作使用GoogleEarth数据的动画和视频而设计。它利用了GoogleEarth强大的三维地图和卫星影像数据库，使用户能够轻松地创建逼真的地球动画、航拍视频和动态地图可视化。网址为https://www.google.com/earth/studio/。GoogleEarthStudio是一个基于Web的动画工具，专为创作使用G</div>
                    </li>
                    <li><a href="/article/1835502578050363392.htm"
                           title="PHP环境搭建详细教程" target="_blank">PHP环境搭建详细教程</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/php/1.htm">php</a>
                        <div>PHP是一个流行的服务器端脚本语言，广泛用于Web开发。为了使PHP能够在本地或服务器上运行，我们需要搭建一个合适的PHP环境。本教程将结合最新资料，介绍在不同操作系统上搭建PHP开发环境的多种方法，包括Windows、macOS和Linux系统的安装步骤，以及本地和Docker环境的配置。1.PHP环境搭建概述PHP环境的搭建主要分为以下几类：集成开发环境：例如XAMPP、WAMP、MAMP，这</div>
                    </li>
                    <li><a href="/article/1835498925755297792.htm"
                           title="DIV+CSS+JavaScript技术制作网页（旅游主题网页设计与制作）云南大理" target="_blank">DIV+CSS+JavaScript技术制作网页（旅游主题网页设计与制作）云南大理</a>
                        <span class="text-muted">STU学生网页设计</span>
<a class="tag" taget="_blank" href="/search/%E7%BD%91%E9%A1%B5%E8%AE%BE%E8%AE%A1/1.htm">网页设计</a><a class="tag" taget="_blank" href="/search/%E6%9C%9F%E6%9C%AB%E7%BD%91%E9%A1%B5%E4%BD%9C%E4%B8%9A/1.htm">期末网页作业</a><a class="tag" taget="_blank" href="/search/html%E9%9D%99%E6%80%81%E7%BD%91%E9%A1%B5/1.htm">html静态网页</a><a class="tag" taget="_blank" href="/search/html5%E6%9C%9F%E6%9C%AB%E5%A4%A7%E4%BD%9C%E4%B8%9A/1.htm">html5期末大作业</a><a class="tag" taget="_blank" href="/search/%E7%BD%91%E9%A1%B5%E8%AE%BE%E8%AE%A1/1.htm">网页设计</a><a class="tag" taget="_blank" href="/search/web%E5%A4%A7%E4%BD%9C%E4%B8%9A/1.htm">web大作业</a>
                        <div>️精彩专栏推荐作者主页:【进入主页—获取更多源码】web前端期末大作业：【HTML5网页期末作业(1000套)】程序员有趣的告白方式：【HTML七夕情人节表白网页制作(110套)】文章目录二、网站介绍三、网站效果▶️1.视频演示2.图片演示四、网站代码HTML结构代码CSS样式代码五、更多源码二、网站介绍网站布局方面：计划采用目前主流的、能兼容各大主流浏览器、显示效果稳定的浮动网页布局结构。网站程</div>
                    </li>
                    <li><a href="/article/1835498547785592832.htm"
                           title="【华为OD机试真题2023B卷 JAVA&JS】We Are A Team" target="_blank">【华为OD机试真题2023B卷 JAVA&JS】We Are A Team</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/%E7%AE%97%E6%B3%95/1.htm">算法</a><a class="tag" taget="_blank" href="/search/%E5%8D%8E%E4%B8%BA/1.htm">华为</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a>
                        <div>华为OD2023（B卷）机试题库全覆盖，刷题指南点这里WeAreATeam时间限制：1秒|内存限制：32768K|语言限制：不限题目描述：总共有n个人在机房，每个人有一个标号（1&lt;=标号&lt;=n），他们分成了多个团队，需要你根据收到的m条消息判定指定的两个人是否在一个团队中，具体的：1、消息构成为：abc，整数a、b分别代</div>
                    </li>
                    <li><a href="/article/1835496149843275776.htm"
                           title="关于城市旅游的HTML网页设计——(旅游风景云南 5页)HTML+CSS+JavaScript" target="_blank">关于城市旅游的HTML网页设计——(旅游风景云南 5页)HTML+CSS+JavaScript</a>
                        <span class="text-muted">二挡起步</span>
<a class="tag" taget="_blank" href="/search/web%E5%89%8D%E7%AB%AF%E6%9C%9F%E6%9C%AB%E5%A4%A7%E4%BD%9C%E4%B8%9A/1.htm">web前端期末大作业</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/%E6%97%85%E6%B8%B8/1.htm">旅游</a><a class="tag" taget="_blank" href="/search/%E9%A3%8E%E6%99%AF/1.htm">风景</a>
                        <div>⛵源码获取文末联系✈Web前端开发技术描述网页设计题材，DIV+CSS布局制作,HTML+CSS网页设计期末课程大作业|游景点介绍|旅游风景区|家乡介绍|等网站的设计与制作|HTML期末大学生网页设计作业，Web大学生网页HTML：结构CSS：样式在操作方面上运用了html5和css3，采用了div+css结构、表单、超链接、浮动、绝对定位、相对定位、字体样式、引用视频等基础知识JavaScrip</div>
                    </li>
                    <li><a href="/article/1835496148601761792.htm"
                           title="HTML网页设计制作大作业（div+css） 云南我的家乡旅游景点 带文字滚动" target="_blank">HTML网页设计制作大作业（div+css） 云南我的家乡旅游景点 带文字滚动</a>
                        <span class="text-muted">二挡起步</span>
<a class="tag" taget="_blank" href="/search/web%E5%89%8D%E7%AB%AF%E6%9C%9F%E6%9C%AB%E5%A4%A7%E4%BD%9C%E4%B8%9A/1.htm">web前端期末大作业</a><a class="tag" taget="_blank" href="/search/web%E8%AE%BE%E8%AE%A1%E7%BD%91%E9%A1%B5%E8%A7%84%E5%88%92%E4%B8%8E%E8%AE%BE%E8%AE%A1/1.htm">web设计网页规划与设计</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/dreamweaver/1.htm">dreamweaver</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a>
                        <div>Web前端开发技术描述网页设计题材，DIV+CSS布局制作,HTML+CSS网页设计期末课程大作业游景点介绍|旅游风景区|家乡介绍|等网站的设计与制作HTML期末大学生网页设计作业HTML：结构CSS：样式在操作方面上运用了html5和css3，采用了div+css结构、表单、超链接、浮动、绝对定位、相对定位、字体样式、引用视频等基础知识JavaScript：做与用户的交互行为文章目录前端学习路线</div>
                    </li>
                    <li><a href="/article/1835495170972413952.htm"
                           title="git - Webhook让部署自动化" target="_blank">git - Webhook让部署自动化</a>
                        <span class="text-muted">大猪大猪</span>

                        <div>我们现在有一个需求，将项目打包上传到gitlab或者github后，程序能自动部署，不用手动地去服务器中进行项目更新并运行，如何做到？这里我们可以使用gitlab与github的挂钩，挂钩的原理就是，每当我们有请求到gitlab与github服务器时，这时他俩会根据我们配置的挂钩地扯进行访问，webhook挂钩程序会一直监听着某个端口请求，一但收到他们发过来的请求，这时就知道用户有请求提交了，这时</div>
                    </li>
                    <li><a href="/article/1835493267907637248.htm"
                           title="webpack图片等资源的处理" target="_blank">webpack图片等资源的处理</a>
                        <span class="text-muted">dmengmeng</span>

                        <div>需要的loaderfile-loader（让我们可以引入这些资源文件）url-loader（其实是file-loader的二次封装）img-loader（处理图片所需要的）在没有使用任何处理图片的loader之前，比如说css中用到了背景图片，那么最后打包会报错的，因为他没办法处理图片。其实你只想能够使用图片的话。只加一个file-loader就可以，打开网页能准确看到图片。{test:/\.(p</div>
                    </li>
                    <li><a href="/article/1835492740536823808.htm"
                           title="node.js学习" target="_blank">node.js学习</a>
                        <span class="text-muted">小猿L</span>
<a class="tag" taget="_blank" href="/search/node.js/1.htm">node.js</a><a class="tag" taget="_blank" href="/search/node.js/1.htm">node.js</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a><a class="tag" taget="_blank" href="/search/vim/1.htm">vim</a>
                        <div>node.js学习实操及笔记温故node.js，node.js学习实操过程及笔记~node.js学习视频node.js官网node.js中文网实操笔记githubcsdn笔记为什么学node.js可以让别人访问我们编写的网页为后续的框架学习打下基础，三大框架vuereactangular离不开node.jsnode.js是什么官网：node.js是一个开源的、跨平台的运行JavaScript的运行</div>
                    </li>
                    <li><a href="/article/1835476093189058560.htm"
                           title="Java 重写(Override)与重载(Overload)" target="_blank">Java 重写(Override)与重载(Overload)</a>
                        <span class="text-muted">叨唧唧的</span>

                        <div>Java重写(Override)与重载(Overload)重写(Override)重写是子类对父类的允许访问的方法的实现过程进行重新编写,返回值和形参都不能改变。即外壳不变，核心重写！重写的好处在于子类可以根据需要，定义特定于自己的行为。也就是说子类能够根据需要实现父类的方法。重写方法不能抛出新的检查异常或者比被重写方法申明更加宽泛的异常。例如：父类的一个方法申明了一个检查异常IOExceptio</div>
                    </li>
                    <li><a href="/article/1835473830873755648.htm"
                           title="简单了解 JVM" target="_blank">简单了解 JVM</a>
                        <span class="text-muted">记得开心一点啊</span>
<a class="tag" taget="_blank" href="/search/jvm/1.htm">jvm</a>
                        <div>目录♫什么是JVM♫JVM的运行流程♫JVM运行时数据区♪虚拟机栈♪本地方法栈♪堆♪程序计数器♪方法区/元数据区♫类加载的过程♫双亲委派模型♫垃圾回收机制♫什么是JVMJVM是JavaVirtualMachine的简称，意为Java虚拟机。虚拟机是指通过软件模拟的具有完整硬件功能的、运行在一个完全隔离的环境中的完整计算机系统（如：JVM、VMwave、VirtualBox）。JVM和其他两个虚拟机</div>
                    </li>
                    <li><a href="/article/1835471058648526848.htm"
                           title="1分钟解决 -bash: mvn: command not found，在Centos 7中安装Maven" target="_blank">1分钟解决 -bash: mvn: command not found，在Centos 7中安装Maven</a>
                        <span class="text-muted">Energet!c</span>
<a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a>
                        <div>1分钟解决-bash:mvn:commandnotfound，在Centos7中安装Maven检查Java环境1下载Maven2解压Maven3配置环境变量4验证安装5常见问题与注意事项6总结检查Java环境Maven依赖Java环境，请确保系统已经安装了Java并配置了环境变量。可以通过以下命令检查：java-version如果未安装，请先安装Java。1下载Maven从官网下载：前往Apach</div>
                    </li>
                    <li><a href="/article/1835470931783413760.htm"
                           title="「豆包Marscode体验官」 | 云端 IDE 启动 & Rust 体验" target="_blank">「豆包Marscode体验官」 | 云端 IDE 启动 & Rust 体验</a>
                        <span class="text-muted">张风捷特烈</span>
<a class="tag" taget="_blank" href="/search/ide/1.htm">ide</a><a class="tag" taget="_blank" href="/search/rust/1.htm">rust</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/%E5%90%8E%E7%AB%AF/1.htm">后端</a>
                        <div>theme:cyanosis我正在参加「豆包MarsCode初体验」征文活动MarsCode可以看作一个运行在服务端的远程VSCode开发环境。对于我这种想要学习体验某些语言，但不想在电脑里装环境的人来说非常友好。本文就来介绍一下在MarsCode里，我的体验rust开发体验。一、MarsCode是什么它的本质是:提供代码助手和云端IDE服务的web网站，可通过下面的链接访问https://www</div>
                    </li>
                    <li><a href="/article/1835469672334585856.htm"
                           title="Java企业面试题3" target="_blank">Java企业面试题3</a>
                        <span class="text-muted">马龙强_</span>
<a class="tag" taget="_blank" href="/search/java/1.htm">java</a>
                        <div>1.break和continue的作用(智*图)break：用于完全退出一个循环（如for,while）或一个switch语句。当在循环体内遇到break语句时，程序会立即跳出当前循环体，继续执行循环之后的代码。continue：用于跳过当前循环体中剩余的部分，并开始下一次循环。如果是在for循环中使用continue，则会直接进行条件判断以决定是否执行下一轮循环。2.if分支语句和switch分</div>
                    </li>
                    <li><a href="/article/1835468916290318336.htm"
                           title="JVM、JRE和 JDK：理解Java开发的三大核心组件" target="_blank">JVM、JRE和 JDK：理解Java开发的三大核心组件</a>
                        <span class="text-muted">Y雨何时停T</span>
<a class="tag" taget="_blank" href="/search/Java/1.htm">Java</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a>
                        <div>Java是一门跨平台的编程语言，它的成功离不开背后强大的运行环境与开发工具的支持。在Java的生态中，JVM（Java虚拟机）、JRE（Java运行时环境）和JDK（Java开发工具包）是三个至关重要的核心组件。本文将探讨JVM、JDK和JRE的区别，帮助你更好地理解Java的运行机制。1.JVM：Java虚拟机（JavaVirtualMachine）什么是JVM？JVM，即Java虚拟机，是Ja</div>
                    </li>
                    <li><a href="/article/1835464504918503424.htm"
                           title="Java面试题精选：消息队列(二)" target="_blank">Java面试题精选：消息队列(二)</a>
                        <span class="text-muted">芒果不是芒</span>
<a class="tag" taget="_blank" href="/search/Java%E9%9D%A2%E8%AF%95%E9%A2%98%E7%B2%BE%E9%80%89/1.htm">Java面试题精选</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/kafka/1.htm">kafka</a>
                        <div>一、Kafka的特性1.消息持久化：消息存储在磁盘，所以消息不会丢失2.高吞吐量：可以轻松实现单机百万级别的并发3.扩展性：扩展性强，还是动态扩展4.多客户端支持：支持多种语言（Java、C、C++、GO、）5.KafkaStreams（一个天生的流处理）:在双十一或者销售大屏就会用到这种流处理。使用KafkaStreams可以快速的把销售额统计出来6.安全机制：Kafka进行生产或者消费的时候会</div>
                    </li>
                    <li><a href="/article/1835462485629562880.htm"
                           title="白骑士的Java教学基础篇 2.5 控制流语句" target="_blank">白骑士的Java教学基础篇 2.5 控制流语句</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%99%E5%AD%A6/1.htm">教学</a><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>欢迎继续学习Java编程的基础篇！在前面的章节中，我们了解了Java的变量、数据类型和运算符。接下来，我们将探讨Java中的控制流语句。控制流语句用于控制程序的执行顺序，使我们能够根据特定条件执行不同的代码块，或重复执行某段代码。这是编写复杂程序的基础。通过学习这一节内容，你将掌握如何使用条件语句和循环语句来编写更加灵活和高效的代码。条件语句条件语句用于根据条件的真假来执行不同的代码块。if语句‘</div>
                    </li>
                    <li><a href="/article/1835462232612368384.htm"
                           title="python语法——三目运算符" target="_blank">python语法——三目运算符</a>
                        <span class="text-muted">HappyRocking</span>
<a class="tag" taget="_blank" href="/search/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/%E4%B8%89%E7%9B%AE%E8%BF%90%E7%AE%97%E7%AC%A6/1.htm">三目运算符</a>
                        <div>在java中，有三目运算符，如：intc=(a&gt;b)?a:b表示c取两者中的较大值。但是在python，不能直接这样使用，估计是因为冒号在python有分行的关键作用。那么在python中，如何实现类似功能呢？可以使用ifelse语句，也是一行可以完成，格式为：aifbelsec表示如果b为True，则表达式等于a，否则等于c。如：c=(aif(a&gt;b)elseb)同样是完成了取最大值的功能。</div>
                    </li>
                    <li><a href="/article/1835457442260021248.htm"
                           title="ArrayList 源码解析" target="_blank">ArrayList 源码解析</a>
                        <span class="text-muted">程序猿进阶</span>
<a class="tag" taget="_blank" href="/search/Java%E5%9F%BA%E7%A1%80/1.htm">Java基础</a><a class="tag" taget="_blank" href="/search/ArrayList/1.htm">ArrayList</a><a class="tag" taget="_blank" href="/search/List/1.htm">List</a><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/%E6%80%A7%E8%83%BD%E4%BC%98%E5%8C%96/1.htm">性能优化</a><a class="tag" taget="_blank" href="/search/%E6%9E%B6%E6%9E%84%E8%AE%BE%E8%AE%A1/1.htm">架构设计</a><a class="tag" taget="_blank" href="/search/idea/1.htm">idea</a>
                        <div>ArrayList是Java集合框架中的一个动态数组实现，提供了可变大小的数组功能。它继承自AbstractList并实现了List接口，是顺序容器，即元素存放的数据与放进去的顺序相同，允许放入null元素，底层通过数组实现。除该类未实现同步外，其余跟Vector大致相同。每个ArrayList都有一个容量capacity，表示底层数组的实际大小，容器内存储元素的个数不能多于当前容量。当向容器中添</div>
                    </li>
                    <li><a href="/article/1835455048277127168.htm"
                           title="Python神器！WEB自动化测试集成工具 DrissionPage" target="_blank">Python神器！WEB自动化测试集成工具 DrissionPage</a>
                        <span class="text-muted">亚丁号</span>
<a class="tag" taget="_blank" href="/search/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a>
                        <div>一、前言用requests做数据采集面对要登录的网站时，要分析数据包、JS源码，构造复杂的请求，往往还要应付验证码、JS混淆、签名参数等反爬手段，门槛较高。若数据是由JS计算生成的，还须重现计算过程，体验不好，开发效率不高。使用浏览器，可以很大程度上绕过这些坑，但浏览器运行效率不高。因此，这个库设计初衷，是将它们合而为一，能够在不同须要时切换相应模式，并提供一种人性化的使用方法，提高开发和运行效率</div>
                    </li>
                    <li><a href="/article/1835454921990828032.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/%E6%A1%86%E6%9E%B6/1.htm">框架</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E4%BB%BB%E5%8A%A1/1.htm">任务</a><a class="tag" taget="_blank" href="/search/html%E8%A7%A3%E6%9E%90%E5%99%A8/1.htm">html解析器</a><a class="tag" taget="_blank" href="/search/%E5%AD%98%E5%82%A8/1.htm">存储</a><a class="tag" taget="_blank" href="/search/%E7%94%B5%E5%AD%90%E5%95%86%E5%8A%A1/1.htm">电子商务</a>
                        <div>一、架构图那里搜网络爬虫框架主要针对电子商务网站进行数据爬取，分析，存储，索引。爬虫：爬虫负责爬取，解析，处理电子商务网站的网页的内容数据库：存储商品信息索引：商品的全文搜索索引Task队列：需要爬取的网页列表Visited表：已经爬取过的网页列表爬虫监控平台：web平台可以启动，停止爬虫，管理爬虫，task队列，visited表。二、爬虫1.流程1)Scheduler启动爬虫器，TaskMast</div>
                    </li>
                    <li><a href="/article/1835454543471669248.htm"
                           title="Java：爬虫框架" target="_blank">Java：爬虫框架</a>
                        <span class="text-muted">dingcho</span>
<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/%E7%88%AC%E8%99%AB/1.htm">爬虫</a>
                        <div>一、ApacheNutch2【参考地址】Nutch是一个开源Java实现的搜索引擎。它提供了我们运行自己的搜索引擎所需的全部工具。包括全文搜索和Web爬虫。Nutch致力于让每个人能很容易,同时花费很少就可以配置世界一流的Web搜索引擎.为了完成这一宏伟的目标,Nutch必须能够做到:每个月取几十亿网页为这些网页维护一个索引对索引文件进行每秒上千次的搜索提供高质量的搜索结果简单来说Nutch支持分</div>
                    </li>
                    <li><a href="/article/1835451016456269824.htm"
                           title="MongoDB知识概括" target="_blank">MongoDB知识概括</a>
                        <span class="text-muted">GeorgeLin98</span>
<a class="tag" taget="_blank" href="/search/%E6%8C%81%E4%B9%85%E5%B1%82/1.htm">持久层</a><a class="tag" taget="_blank" href="/search/mongodb/1.htm">mongodb</a>
                        <div>MongoDB知识概括MongoDB相关概念单机部署基本常用命令索引-IndexSpirngDataMongoDB集成副本集分片集群安全认证MongoDB相关概念业务应用场景：传统的关系型数据库（如MySQL），在数据操作的“三高”需求以及应对Web2.0的网站需求面前，显得力不从心。解释：“三高”需求：①Highperformance-对数据库高并发读写的需求。②HugeStorage-对海量数</div>
                    </li>
                    <li><a href="/article/1835450890077696000.htm"
                           title="python怎么将png转为tif_png转tif" target="_blank">python怎么将png转为tif_png转tif</a>
                        <span class="text-muted">weixin_39977276</span>

                        <div>发国外的文章要求图片是tif，cmyk色彩空间的。大小尺寸还有要求。比如网上大神多，找到了一段代码，感谢！https://www.jianshu.com/p/ec2af4311f56https://github.com/KevinZc007/image2Tifimportjava.awt.image.BufferedImage;importjava.io.File;importjava.io.Fi</div>
                    </li>
                    <li><a href="/article/1835448239864770560.htm"
                           title="JavaScript 中，深拷贝（Deep Copy）和浅拷贝（Shallow Copy）" target="_blank">JavaScript 中，深拷贝（Deep Copy）和浅拷贝（Shallow Copy）</a>
                        <span class="text-muted">跳房子的前端</span>
<a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E9%9D%A2%E8%AF%95/1.htm">前端面试</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>在JavaScript中，深拷贝（DeepCopy）和浅拷贝（ShallowCopy）是用于复制对象或数组的两种不同方法。了解它们的区别和应用场景对于避免潜在的bugs和高效地处理数据非常重要。以下是对深拷贝和浅拷贝的详细解释，包括它们的概念、用途、优缺点以及实现方式。1.浅拷贝（ShallowCopy）概念定义：浅拷贝是指创建一个新的对象或数组，其中包含了原对象或数组的基本数据类型的值和对引用数</div>
                    </li>
                    <li><a href="/article/1835444076007223296.htm"
                           title="JAVA·一个简单的登录窗口" target="_blank">JAVA·一个简单的登录窗口</a>
                        <span class="text-muted">MortalTom</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><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a>
                        <div>文章目录概要整体架构流程技术名词解释技术细节资源概要JavaSwing是Java基础类库的一部分，主要用于开发图形用户界面（GUI）程序整体架构流程新建项目，导入sql.jar包（链接放在了文末），编译项目并运行技术名词解释一、特点丰富的组件提供了多种可视化组件，如按钮（JButton）、文本框（JTextField）、标签（JLabel）、下拉列表（JComboBox）等，可以满足不同的界面设计</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>