javaWeb 前端
文章目录
- javaWeb 前端
- Html
- css
- javaScript
- 事件和事件句柄
- click（事件）和onclick（事件句柄）
- window 窗口
- alert（）消息弹窗
- 注释
- 第三种 引入外部独立的js文件
- java强类型 javascript弱类型
- 在javascipt中变量没有赋值 默认赋值 undefined 他是一个值
- 一个变量没有声明直接使用 会报错 age is not defined
- javascript的方法定义
- 全局变量 和 局部变量
- js中数据类型
- typeof语法格式
- js中比较字符串是否相等使用“==”完成 没有equals
- Undefined
- Number
- Boolean
- String字符串
- Object
- null和NaN和undefined区别
- js中的事件
- 写一步测一步 alert
- BOM
- 之后学习内容
-
看到最后的帮忙点个==赞==???????? 谢谢,这个对我真的很重要！
Html
单元格合并
行------>rowspan
列------>colspan
meta
设置图片 img
“” 或者是
属性
width宽 height高
设置图片宽度和高度时，只设置宽度，高度会自动进行等比例缩放；
设置一个就好 都设置 会失真；
title ：设置鼠标悬停时显示的信息
alt：设置图片加载失败时 显示的文本信息
超链接
target 窗口
_blank : 新窗口
_self : 当前窗口（默认）
_top ：顶级窗口
_parent : 父窗口
表单 form
属性
method
get 显示
post 隐藏
action属性 = URL （提交给哪一个服务器的地址）
必须有name 才能够提交
http协议
action?name=value&name=value&name=value。。。很重要！！！
单选 多选
提交给服务器的值 是value中指定的 男 或 女
单选按钮的value值必须手动指定
鼠标点击的都需要写value 用户输入的不用写value
单选多选按钮外面的信息只是给用户看的 真正提交给服务器的是value中的值
checked 默认选中
http和表单
两种都可以提交数据
http 固定传送值 发送方式get 可以看到
表单 可以手动输入
多选
multiple=“multiple” size =显示项目条数
文件上传 type=“file”
隐藏控件 hidden
readonly和disabled
都是只读
id
更方便过获取元素
不能重复
html是一棵树
div和span
css
什么是css
html中嵌套css三种方式
第一种：内联定义方式
第二种：样式块方式
第三种：链入外部样式表文件
使用link标签
选择器
id选择器：指定具体的某一个标签 唯一性
#id{
}
标签选择器：某一个标签 input 或button
标签{
}
类选择器：可以跨标签 任意某几个合起来一起修改
.类名{
}
javaScript
javaScript的”目标程序“以普通文本形式保存，这种语言都叫做”脚本语言“
事件和事件句柄
click（事件）和onclick（事件句柄）
onclick html属性
window 窗口
alert（）消息弹窗
html中嵌入js代码
注释
第一种 直接在 标签属性onclick事件句柄中写js代码
第二种 脚本块的方式
第三种 引入外部独立的js文件
>java强类型 javascript弱类型
java强类型
八种数据类型
byte shot int long float double boolean char
1248 4812
javascript弱类型
var 变量名；
变量名 = 值；
在javascipt中变量没有赋值 默认赋值 undefined 他是一个值
一个变量没有声明直接使用 会报错 age is not defined
javascript的方法定义
方法两个参数 只传一个参数 另一个默认undefined
方法两个参数 不传参数 结果 NaN
方法两个参数 但是传三个参数也是可以的 但是只会计算前两个参数
js中不存在重载
js中函数名字不能同名
如果有两个同名函数 后一个函数把前一个函数覆盖掉
结果 test1 test1
全局变量 和 局部变量
全局变量（不推荐）
局部变量
就近原则
当一个变量声明的时候没有使用var关键字，那么不管这个变量是在哪里声明的，都是全局变量
js中数据类型
原始数据类型
Undefined Number String Boolean Null
ES6之后又加了一个 Symbol
js中有一个运算符typeof 这个运算符可以再程序运行阶段动态的获取变量的数据类型
typeof语法格式
js中比较字符串是否相等使用“==”完成 没有equals
bug：
null 类型是null 但是typeof结果是 object
Undefined
Number
NaN
+字符串拼接 abc10
Infinity（无穷大）
isNaN
parseInt（）可以将字符串自动转换成数字，并且取整数位
parseFloat（）可以将字符串自动转换成数字
Math.cell() 向上取整 2.1—>3
Boolean
if（）中会自动转换为Boolean类型
规律：“有”为true 没有为false
String字符串
单引号 和 双引号1方式：
字符串的两种创建方式：
-
var s = “abc”； 类型 String 小String
-
var s2 = new String(“abc”); 类型 Object 大String
-
无论大小 他们的属性和方法都通用
-
属性方法：
- length属性 长度
- substr（substr（startIndex,length）(开始索引，长度)）和substring( 索引开始，索引结束 不包含)
3.
Object
属性
prototype属性（常用 给类动态的扩展属性和函数）
constructionuctor
函数
toString（）
valueOf（）
toLocaleString（）
自己定义的类属于Object类 所以也有prototype
创建自定义类和创建函数一样两种方法 只是创建对象时需要new 类名
访问一个对象的属性两种方法
js中 类的定义和构造函数一同 创建 (给参数)
prototype就是给一个已经定义好的类 再增加属性或方法
null和NaN和undefined区别
- 数据类型不一样 object number undefined
- null 和 undefined 等同
- 等同运算符（= =）和全等运算符（===）
- == 只判断值是否相等
- === 判断值 又判断数据类型 是否相等
js中的事件
blur 失去焦点
focus 获得焦点
click 鼠标单击
dbclick 鼠标双加
keydown 键盘按下
keyup 键盘弹起
mousedown 鼠标按下
mouseover 鼠标经过
mouseremove 鼠标移动
mouseout 鼠标离开
mouseup 鼠标弹起
reset 表单重置
submit 表单提交
change 下拉列表选项中项改变 ， 或文本框内容改变
select 文本被选中
load 页面加载完毕（整个html页面中所有元素全部加载完毕之后发生。）
回调函数： 自己写函数 用户点击调用
角度不同 编写者 回调函数
使用者 正项调用
注册事件的两种方式
1.直接写 onclick
2.存js代码
js 存一步执行
document.getElementById(“mybtn2”).onclick = function(){
}
load 事件 js执行顺序
有什么节点都可已进行 “.”点出来
键盘
回车键值13
ESC键值27
event有一个keycode属性 获取输入的键值
function(event){
event.keycode
}
href=“ ”什么都不填为默认路径 当前路径 页面不跳转 填入 javascript：void（0）
控制语句（了解）
for in（js中）与foreach 用在数组中
for(var i in arr){//这里的i是数组下标
//和foreach不一样 foreach里的是数组中的元素
}
for in 也可以用在对象中
i代表着对象的属性名
with
with（u对象）{
里面的属性方法 自动添加u.
}
BOM和DOM区别
BOM包含DOM
获取文本框的value
this.value
innerText和innerHTML属性有什么区别？
相同点： 都是设置元素内部的内容
不同点：
innerHTML：会把后面的“字符串”当做一段html代码解释执行
innerText： 即使后面是一段html代码，也只是将其当做普通字符串
正则表达式
创建方式一：
var regExp = /正则表达式/flags（gim）
创建方式二：
var regExp = new RegExp（“正则”，flags）；
test（）方法
测试：
写一步测一步 alert
复选框全选与取消
下拉列表
onchange
日期
当前日期
new date (Sun May 31 2020 09:48:23 GMT+0800 (中国标准时间))
时间戳(timestamp)
new date.getTime() (1590889703719)
window.setInterval（）和 window.clearInterval( )？？？？？？
一 document.getElementById()
二 onclick
数组
数组中没传值默认undefined
创建 遍历
BOM
在事件和按钮中写
两个函数开启关闭窗口
window.open(“窗口”，打开窗口的方式4种)
window.close()关闭
window.alert() 消息框
window.confirm() 确认框
历史记录
window.history.back()后退
window.history.go(1)前进
document.location()
window.location()
有哪些方法可以通过浏览器往服务器发送请求？
如果当前窗口不是顶级窗口，将当前窗口变为顶级窗口
if(window.top!=window.self){
window.top.location = window.self.location
}
JSON
json无类型对象
JSON和XML
json用途：一种标准的数据交换格式
json特点：轻量级 体积小 易解析
xml作用相同 但是特点：体积大 解析麻烦 但是语法严谨（银行系统）
XML和HTML
json结构
json数组
复杂一些json对象
eval函数 window.eval（）
【java连接数据库，查询数据之后，将数据在java程序中拼接成json格式的字符串，将json格式的字符串响应到浏览器
也就是说java响应到浏览器上的仅仅是一个json格式的字符串，还不是一个json对象
可以使用eval函数，将json格式的字符串转换成json对象】
js中的[]和{}
js中访问json对象的属性
json将java中传过来的数据显示在网页table中
java传过来的数据
按钮事件
显示的位置
div
span