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" 在新窗口中打开打开超链接的方式

正则表达式 (弊端：阅读性较差)
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]+)+";

组的含义:将部分进行封装以便重用

特殊字符避免被解析
<: <
>: >
&: &amp
空格:  

标题: <h1> .... <h6>

被点击后,会启动引所对应解析程序取查找指定主机
1. 先去查找本地主机的hosts文件.如果没有找到该主机对应的ip地址
2. 取公网的 DNS服务器上找对应的ip地址

定位标记
<a name="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")

选择器：样式要作用的标签容器

当样式分离后,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

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)" οnclick="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

正则表达式判断中文还是英文

英文function isEnglish(s){

s = s.trim();