javascript
HTML+CSS+Javascript === DHTML
dynamic html
----------------------------------------------
javascript
1 事件
2 DOM
获得标签对象
var element = document.getElementById();
var elements = document.getElementsByTagName();
element.parentNode
element.childNodes
element.firstChild
element.lastChild
element.nextSibling
element.previousSibling
a) 修改文档内容
element.属性
element.style.
b) 修改文档结构
var div = document.createElement("div");
var txt = document.createTextNode("value");
parentNode.appendChild();
parentNode.removeChild();
----------------------------------------------------
parentNode.removeChild(childNode);
tbody.removeChild(tr); ?获得tr?
<input type="button" value="delete" onclick="delPerson()"/>
btn.onclick= delPerson();
<input type="checkbox" checked="checked"/>
document.getElementsByTagName("input");
tbody.getElementsByTagName("input");
--------------------
innerHTML
innerText (IE);
标签元素的属性
tr.innerHTML = "<td></td><td></td><input type=""/></td>"
----------------------------
BOM Broswer Object module
浏览器 对象 模型
javascript 内置对象
window
方法 可以省略window
window.alert();
.prompt();
.confirm();
i = .setTimeout(fun,毫秒数); 定时执行一个程序
.clearTimeout(i); 清空这次定时程序
i = setInterval(fun,毫秒数); 周期性的执行定时程序
.clearInterval(i); 清空周期性定时程序
open(); ---- 打开一个新的网页
close(); ---- 关闭一个新的网页
---- 只有在open方法打开的页面中
调用window.close()才有意义
--------------------
document
document.write();
document.writeln();
DOM
document.getElementById();
document.getElementsByTagName();
document.createElement();
document.createTextNode();
document.forms[0]
.images[]
.anchors[]
document.forms[0] ----->
Form标签对象
form.elements[] ---> 表单标签的子标签
<form method="" action="">
<input type="text" name=""/>
<input type="text" name=""/>
</form>
document.forms[0].elements[0]
<form method="post" action="">
<input type="submit" value="submit"/>
<input type="button" value="click me"/>
</form>
document.forms[0].submit(); ---- > <input type="submit"/>
效果一样的功能
location 代表地址栏
location.href=""
作用在地址栏中指定一张网页的路径
history
history.back();
history.forward();
------------------------------------------------------
java动态网页技术
服务器 Tomcat Jboss Weblogic WebSphere
Resin ClassFish SunAppOS
java
我的电脑
属性
高级
环境变量
1 Path 修改
c://Progrmam Files/java/jdk1.6/bin;path
2 CLASSPTH 新建
3 JAVA_HOME
c://program Files/java/jdk1.6
启动tomcat
cd d:tomcat_home/bin
startup.bat
浏览器 http://localhost:8080/
--------------------
JavaWeb编程
JavaEE编程
Servlet JSP
---------------------------------------------
软件的发展历程
1 单机版软件
2 网络
c/s架构的软件 2层架构 特点
client（客户端） server(数据库服务器）
ATM
ATM （client) ---- server（数据库服务器）
+200 ---- account 更新操作
-200
好处：
缺点：client功能太多了 ,修改很麻烦
client功能？
1 UI 用户界面
2 业务处理 业务操作
3 协议处理功能
c/s 3层体系架构
瘦client
client ----- Server(应用服务器）----Server(数据库服务器)
1 UI 1 业务处理功能
2 协议处理
Server(client) --- Server(应用服务器） ---- Server(数据库服务器)
?思想
1 html充当
好处 1）html小
2）浏览器中
3) http协议
B/S （瘦client应用） sohu（互联网应用） baidu dangdang 360（京东)
broswer server
client --- 由服务器中的html页面充当ui
http协议
总结 b/s 服务器存储 程序
由服务器软件(tomcat )调用程序
生成html页面 返回给用户的client（浏览器)
由 tomcat调用的方法 必须 实现一个接口
Servlet{
service(){
xxx
xx
}
}
Servlet{
serivce(){
}
}
----------------------------------------------------
JavaWeb程序的开发 TOMCAT
准备环境
1 安装服务器软件
2 webapps ---- web applications
|― servletapp （名字随便写)
|-WEB-INF
|- classes --- java类
|- lib --- 需要的jar
|- web.xml copy 别的项目
核心开发
3 创建java类 生成动态页面
implements Servlet{
public void service();
}
javac -d . HelloServlet.java
tomcat_home
|-lib
|-servlet-api.jar
CLASSPATH
.;D:\tomcat\lib\servlet-api.jar
4 注册 web.xml
目的：让tomcat知道 写过类
<servlet>
<servlet-name>Hs</servlet-name>
<servlet-class>全限定名</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>Hs</servlet-name>
<url-pattern>/xx</url-pattern>
</servlet-mapping>
运行程序
1 启动 tomcat ---》 tomcat_home/bin startup.bat
2 访问 浏览器访问
url
http://localhost:8080/servletapp/hs