JAVA前端部分(HTML+CSS+JavaScript)(狂神说笔记)
【HTML】
1.初识HTML:
2.元素=标签+属性+内容
(1)网页基本标签
(2)图像标签
(3)超链接标签
a、页面间链接
b、锚链接
c、功能性链接
QQ链接代码在“QQ推广”里生成。
【补充】块元素和行内元素
元素包括:标签、属性、内容。
(4)列表标签
(5)表格标签
(6)媒体元素
3.页面结构
放在<body></body>里面。
4.内联框架:
target相当于指针,name相当于变量名。
target属性,相当于把“hello”和链接绑定了,然后内联框架可以通过name=“hello”访问这个链接。
5.初识表单post和get提交:
6.表单元素格式:
name和value的区别?
(1)文本框和单选框
文本框:
单选框:
(2)按钮和多选框:
按钮:
多选框:
(3)下拉框、文本域和文件域:
下拉框:
文本域:
文件域:
(4)简单验证和滑块:
验证:
滑块:
搜索框:
【CSS】
1.CSS是什么?
(1)CSS是什么
在网页里按F12进入开发者模式,更改代码,ctrl+s保存。
(2)css的四种导入方式:
1.内部样式:
直接写在<style>标签里
2.行内样式:
<h1 style="color:red;">我是标题</h1>
3.外部样式:
(1)link标签,href属性指向css文件地址。
<link rel="stylesheet" href="css/1.css">
(2)导入式:(CSS2.0)
优先级:行内样式>内部样式>外部样式
2.选择器
选择器作用:选择页面上的某一个元素或某一类元素。
2.1基本选择器
(1)标签选择器
会选择页面上所有这个标签的元素。
(2)类选择器(class)(复用)
(3)id选择器(全局唯一)
优先级:id>class>标签
2.2.层次选择器:
(1)后代选择器
在某个元素的后面生效。
(2)子选择器
一代。
(3)相邻兄弟选择器(大弟)
兄弟,而且相邻,只有一个(向下)
(4)通用选择器(所有弟弟)
2.3.结构伪类选择器:
伪类:条件;冒号。
2.4.属性选择器(重要)
= 等于
*= 包含
^= 开头
$= 结尾
例子;
3.美化网页元素
3.1 文本样式
3.2 文本阴影和超链接伪类
3.3 列表样式
3.4 背景图像及渐变
3.5 盒子模型及边框使用
4.盒子模型及边框使用
5.浮动
6.定位
6.1 相对定位
相对于原来的位置
6.2 绝对定位
6.3 固定定位
6.4 z-index
7.动画
8.css预处理器
【Javascript】
UI框架:
1.什么是Javascript?
世界上最流行的脚本语言。
2.快速入门
2.1 引入JavaScript
(1)内部标签
(2)外部引入
2.2 基本语法入门
console.log(score); //在浏览器打印变量
2.3 数据类型
数值、文本、图形、音频、视频。。。
(1)Number
js不区分小数和整数,同意用Number
(2)字符串
“abc” ’abc‘
(3)布尔值
true,false
(4)逻辑运算
&& || !
(5)比较运算符
(6)null、undefined
(7)对象
3.数据类型
3.1 字符串
3.2 数组
3.3 对象
3.4 流程控制
3.5 Map和Set
3.6 iterator
4.函数
方法:放在对象中的函数。
函数:对象外。
4.1 函数定义
4.2 变量作用域(var)
全局对象:window,可以调用所有全局变量。
4.3 方法
4.4 闭包(难点)
4.5 箭头函数(es6新特性)
4.6 创建对象
4.7 class继承(es6新特性)
4.8 原型链继承(难点)
5.内部对象
5.1 Date
5.2 JSON
什么是json?
数据传输的格式。
5.3 Ajax
6.面向对象编程
7.操作BOM对象
BOM:浏览器对象模型。
7.1 window
window:代表浏览器窗口
7.2 navigator
navigator:封装了浏览器的信息。
不建议使用navigator对象来判断和编写代码,因为会被人为修改!
7.3 screen
代表屏幕尺寸
7.4 location
代表当前页面的URL信息。
7.5 document
(1)document代表当前的页面
(2)获取具体的文档树节点
(3)获取cookie
7.6 history(不建议使用)
8.操作DOM节点
节点的增删改查:
8.1 查
8.2 改
(1)操作文本
(2)操作css
8.3 删
先获取父节点,再通过父节点删除自己。
8.4 增
append
9.操作验证
9.1什么是表单?
9.2 获得要提交的信息
9.3 提交表单。md5加密密码,表单优化。
10 jQuery
jQuery库,里面存在大量的javascript函数。
不会就查文档。
导入:
10.1 jQuery选择器
可以使用css中的选择器。
10.2 jQuery事件
鼠标事件、键盘事件、其他事件
函数写在action( )里,代表事件。
10.3 操作DOM
11 结语
前端开发一定要学会借鉴相关的前人的代码,这是进步最快的方式。
F12进入开发者模式,DELETE不需要的标签,然后自行进行改动。
【JAVAWEB】