html与JavaScript回顾
<table>标签中 THEAD TFOOT TBODY 表格由行所组成,行由单元格组成 表格中默认都有一个标签tbody
THEAD TFOOT表格列信息 TBODY 控制表格分行下载,可先显示部分内容,避免全部解析后一起显示
<form>标签 与服务器交互
action属性: 指定数据提交的目的地
get与post get会把提交的信息显示在地址栏上,post不会 get对于敏感信息不安全 post安全 get最长2083 提交数据体积受地址栏的限制, post没有,可以提交大体积数据 get将提交信息封装在请求行,也就是http消息头之前. post 数据体中,也就是http消息头之后的空行后
对于服务端而言: 表单尽量用post提交,因为涉及到编码问题 tomcat默认的解码方式是 iso8859-1 对于post提交的中文。 在服务器端可以直接用setCharacterEncoding("gbk")就可以解决 对于get提交的中文。 在服务器端只能通过 iso8859-1将数据解码一次,在通过指定码表如GBK进行解码
使用表单的组件不一定要使用form标签,只有需要将数据进行提交的时候才用到form标签
体标签 <pre>标签保持数据原样格式输出 <p>标签 段落分隔 <b>加粗 <strong> <i>斜体 <u>下划线 <sub>下标 <sup>上标 <marquee direction=""> 由右向左飞入 direction飞入方向(left right up down) behavior飞入方式 slide常用
头标签
href: mailto:111@163.com 发送邮件 thunder://.... 迅雷下载 target="_blank" 在新窗口中打开 打开超链接的方式
<meta> <meta name="keywords" content="超人"/> name 属性 :网页的描述信息 http-equiv 属性:模拟http协议的响应消息头 <meta http-equiv="refresh" content="3;url=http://www.sina.cn"/> 无指定url则在本页面刷新
<link> rel 属性:描述目标文档与当前文档的关系 type 属性:文档类型 meida:指定目标文档在哪种设备上起作用
<link rel="stylesheet" type="text/css" media="screen,print" href="a.css"/>
正则表达式 (弊端:阅读性较差) 1.匹配 String matches(regex) 2.获取(查找) Pattern p = Pattern.compile("a*b"); Matcher m = p.matcher("aaaaab"); boolean b = m.matches();
while(m.find()){ System.out.println(m.group()); } 3.切割String split(regex); 4.替换String replaceAll(regex,str)
网络爬虫 通过网络以及IO读取网页中的源文件,并且通过规则获取网页中的符合规则的数据
eg: mial爬虫
String mailreg="[a-zA-Z0-9]{6,12}@[a-zA-Z0-9]+(\\.[a-zA-Z]+)+";
组的含义:将部分进行封装以便重用
特殊字符 避免被解析 <: < >: > &: & 空格:
标题: <h1> .... <h6>
<a href="http://www.sina.com.cn">新浪</a>
被点击后,会启动引所对应解析程序取查找指定主机 1. 先去查找本地主机的hosts文件.如果没有找到该主机对应的ip地址 2. 取公网的 DNS服务器上找对应的ip地址
定位标记 <a name="top">页首</a>
<a href="#top">回到页首</a>
文本区域<textarea>
表单组建通常都需要定义name和value属性,因为要将数据发送给服务端 服务端只有知道了该name的值才可以对提交的数据进行分别获取
css层叠样式表 将网页中的样式分离出来,完全由CSS来控制 增强样式的复用性以及可扩展性
格式: 选择器{属性名:属性值;属性名:属性值;....}
css和html相结合的四种方式
1.每一个html 标签都有一个 style属性
2. 当页面由多个标签有相同样式时,可以进行复用 <style> css代码 </style> 3 当有多个页面中的标签样式相同时,还可以将样式单独封装为一个css文件 <style> @import url("1.css"); </style>
4.通过html中head标签中的 link标签链接一个css文件 <link rel="stylesheet" href=".css">
技巧: 为了提高相同样式的复用性以及可扩展性,可以将多个标签样式进行单独定义,并封装成css文件
一个CSS中使用CSS的import将多个标签样式文件导入 然后 在html页面上,使用link标签导入这个总的css文件
eg:
1.css:
@import url("p.css"); 2import url("div.css")
<link rel="stylesheet" href="1.css"/>
选择器:样式要作用的标签容器
当样式分离后,html作用在于用标签封装数据. 然后将CSS家在到指定标签上
选择器分类: 1.标签选择器 2.类选择器: 其实就是每一个标签中的class属性,用 .的形式表示 只用来给CSS使用。可以对不同标签进行相同样式设定 3.ID选择器: 其实就是每一个标签中的ID属性。 但是要保证ID唯一性.用#来使用
ID不仅可以被CSS使用,还可以被JAVASCRIPT使用
选择器优先级; ID>class>标签
扩展选择器: 1.关联选择器: 其实就是对标签中的标签进行样式定义.选择器 选择器... 2.组合选择器: 对多个选择器进行相同样式定义。 多个选择器用,隔开 3.伪元素选择器: 其实就是元素的一种状态 a:link:超链接被点前状态 a:visited:超链接点击后状态
a:hover:悬停在超链接上 a:active: 点击超链接时
定义这些状态时,有一个顺序 L V H A
p:first-letter p:first-line :focus:
CSS滤镜: 通过一些代码完成丰富了样式
网页设计:css+div
div: 行级区域 span:块级区域 p:行级区域 p中不要嵌套div
JS 弱类型语言 基于对象和事件驱动 特殊常量值:undefined,当变量未初始化就被使用,该变量的值就是undefined.
js中0就是false,非0就是true(通常用1表示) null是false
js中连接两个或者多个表达式时要用&&或者|| 如果用&或者|则会进行位运算
true 可直接进行运算 eg:
document.write<script type="text/javascript"> //表格显示99乘法表 document.write("<table>"); for(var x=1;x<=9;x++){ document.write("<tr>"); for(var y=1;y<=x;y++){ document.write("<th>"+y+"*"+x+"="+y*x+"</th>"); } document.write("</tr>"); } document.write("</table>"); </script>();
js中的数组可变长,不存在下标越界,可存放不同了类型数据
var arr = [4,11,14,2,3,5];
var arr = new Array();
JS函数function
function show(){ alert("show"); } show();
无重载形式,带return,js中函数本身就是一个对象,函数名就是对象名
argments 可用来遍历参数
argments.length
动态函数: var show = new Function("x","y","var sum= x+y; return sum;"); 匿名函数: 通常用于事件的处理: window.onload = function{ alert("加载完毕"); }
with(stu){ alert(name+".."+age); } 确定对象作用的范围
遍历属性 for(s in stu){ alert(s+".."+stu[s]); }
遍历数组 for(x in arr){ alert(arr[x]); }
//整数进制转换 parseInt("110",2); toString(2);
//给已有的对象添加方法 让对象本身获得功能 Arry.prototype.getZuiDa = getMax;
DOM:document object model 将一些标记型文档中的内容当成对象
dom三层模型: dom1: 将html文档封装成对象 dom2: 将xml文档封装成对象 dom3: 将xml文档封转成对象
DHTML: 动态HTML html css dom javascript 综合 html: 将数据进行封装 dom: 将标签封装成对象 css: 负责标签中数据的样式 javascript:将三者进行融合,通过程序设计方式来完成动态效果的操作
xmlHttpRequest --> AJAX
<div id="divid"> haha </div>
var obj = getElementById("divid"); obj.tagName obj.innerText
function show(){ return "show run"; } var method = show(); var method = show; 第一句表示的是show方法运行后的结果赋给method变量 第二句表示的是将show指向的对象的地址赋给method,那么method也指向了该对象 那么通过method(); 的形式来调用这个show方法
alert(p["name"]+".."+p.age);
JS中有一些已经定义好的对象 String,Math,Date,Array,Function prototype可以获取指定的对象引用
常见的全局方法(不需要对象调用) Globel parseInt(numstr,[radix]); var num = parseInt("110",2); // 6 按二进制转换
var x = 6; var y = x.toString(2);// 110 获取6的二进制
节点类型: 标签型节点:类型:1 文本型节点:类型:3 注释型节点:类型:8 document: 类型: 9
一般字体16px <a href="javascript:void(0)" onclick="changeSize('10px')">改变字体大小</a> 取消超链接
function changeSize(size){ var node = document.getElementById("newsId"); node.style.fontSize = size; }
var tabNode = createElement("table"); var trNode = tabNode.insertRow(); var tdNode = trNode.insertCell(); tdNode.innerHTML();
常用function
正则表达式判断 中文还是英文