Java Web
基础网页开发技术有哪些,每个技术分别有什么作用
- HTML CSS JavaScript
- HTML:定义网页的结构
- CSS: 定义网页的表现,样式
- JavaScript: 定义网页的行为
HTML页面由哪几个部分组成
- 超文本;文字信息,图片,音频,视频
- 标记语言;
#### 文本标签 - **文本标签顾名思义,都是用来修饰文本的,包括标题,段落,加粗等**
标签 | 描述 |
<h1> ~ <h6> | 定义标题,h1最大,h6最小 |
<font> | 定义文本的字体、字体大小、字体颜色 |
<b> | 定义粗体文本 |
<i> | 定义斜体文本 |
<u> | 定义文本下划线 |
<center> | 定义文本居中 |
<p> | 定义段落 |
<br> | 定义折行 |
<hr> | 定义水平线 |
字体标签<font>
- 字体标签,修饰文本的颜色、大小、样式
属性 | 描述 |
color | 设置文本的颜色 |
size | 设置文本的大小,取值为1-7,其中1最小,7最大 |
face | 用来设置字体。如 “楷体”、"宋体"等 |
图片音频视频标签
- 图片标签<img>:在页面上引入图片的
属性 | 描述 |
height | 用来定义图片的高度 |
width | 用来定义图片的宽度 |
src | 规定显示图像的 url(统一资源定位符) |
- 音频标签<audio>:定义音频(支持MP3、MAV、OGG)
属性 | 描述 |
src | 规定音频的 url |
controls | 显示播放控件 |
- 视频标签:<video>定义视频(支持MP4、WebM、OGG)
属性 | 描述 |
src | 规定视频的 url |
controls | 显示播放控件 |
img标签如何设置图片路径?如何设置图片的宽高?
- 路径(src)
- 绝对路径
- 绝对磁盘路径;绝对网络路径
- 相对路径
- 当前路径:.
- 上级路径:. .
- 尺寸
- height:高
- width:宽
- 尺寸单位:
- 像素 px
- 百分比 %
a标签如何设置跳转页面?table标签如何设置往和单元格?
- 超链接标签<a>:定义超链接,用于连接到另一个资源
- href:指定访问资源的URL
- target:参数可选 _self 或 _blank
- _self : 默认值;当前页面跳转
- _blank:打开新的页面跳转
- 表格标签<table>:定义表格
* border:边框宽度
* width:表格宽度
* cellspacing:单元格之间的空白
- tr:定义行
- align:定义表格行的内容对齐方式
- td:定义单元格
- th:定义表头单元格
布局标签:<div>、<span>
标签 | 描述 |
<div> | 定义HTML文档中的一个区域部分,经常与CSS一起使用,用来布局页面。 |
<span> | 用来组合行内元素。一般用来展示文本 |
div和span有什么区别?
- div :独占一行,div的高度想要高一点,可以通过css设置高度
- span:仅仅占据文本部分
表单的主要作用是什么?表单中的数据想被提交需要满足哪些条件?
- 作用: 采集用户输入的信息,提交给服务器
- form:定义表单
- action:定义表单数据提交的服务器地址
- method:定义表单数据提交的方式,一般有get和post这2种
- get:【默认】浏览器会将数据直接拼接在表单的提交的URL之后。大小有限制(4KB)
- post:浏览器会将数据放到http请求消息体中。大小无限制
- input:定义表单项,通过type属性控制输入形式,接受用户的信息
- type:控制输入形式
- text:文本
- password:密码
- radio:单选按钮
- checkbox:复选框
- file:文件上传按钮
- hidden:隐藏域
- submit:提交
- reset:重置
- button:按钮
- value:默认值,用于radio和checkbox中时,表示被选中时表单提交的值
- name:获取参数的key
- select:定义下拉列表,<option>字标签定义选项
- option:定义选项列表
- textarea:定义文本域
- cols: 一行输入多少个字符
- rows: 输入的行数
type取值 | 描述描述 |
text | 默认值,定义单行的输入字段 |
password | 定义密码字段 |
radio | 定义单选按钮 |
checkbox | 定义复选框 |
file | 定义文件上传按钮 |
hidden | 定义隐藏域 |
submit | 定义提交按钮,提交按钮会把表单数据发送到服务器端 |
reset | 定义重置按钮,重置按钮会清除表单中的所有数据 |
button | 定义可点击按钮 |
CSS翻译成中文叫什么?有什么作用?
- css (Cascading Style Sheet) :层叠样式表
- 用于控制页面的样式(表现)
- ·
1.CSS的引入方式有哪几种?2.各种引入方式分别如何实现?
- 内联样式
- 在标签内部使用style属性
- 内联样式会出现大量的代码冗余,不方便后期的维护,所以不常用
- 内部样式
- 定义
CSS有哪几种常见选择器,分别怎么编写?
- 概念:选择器是选取需设置样式的元素(标签),多个选择器选中同一元素,范围小的生效
- 元素选择器;根据元素名;
- id选择器;根据元素的id;#id属性值
- 类选择器;根据.class属性值选择;.class属性值
JS
- 内部js:定义 <script>标签,在标签内定义js
- 外部js:定义 <script src=“”>标签,引入外部的js文件
- src:外部js文件路径
书写语法
- 区分大小写:与 Java 一样,变量名、函数名以及其他一切东西都是区分大小写的
- 每行结尾的分号可有可无
- 大括号表示代码块
- 注释:
- 单行注释:// 注释内容
- 多行注释:/* 注释内容 */
我们需要借助js中3钟输出语句,来演示书写语法
api | 描述 |
window.alert() | 警告框 |
document.write() | 在HTML 输出内容 |
console.log() | 写入浏览器控制台 |
js中的变量和
java中变量最大的区别是什么?var关键字和let关键字定义变量有什么区别?
- js是弱语言,变量可以存放不同类型的值,Java严格区分数据类型,只能存同类型数据
- var:全局变量,可以重复定义,早期ECMAScript5中用于变量声明的关键字
- let:局部变量,只在代码块内有效,不可重复定义,ECMAScript6中新增的用于变量声明的关键字,相比较var,let只在代码块内生效
- const::声明常量的,常量一旦声明,不能修改
1. js中五种原始类型分别是什么? 2. 10==""10”和10=="10”结果分别是什么 3. js中字符串怎么转整数? 4.NaN是什么?
- js的五种数据类
- number:数字(整数、小数、NaN(Not a Number)
- string:字符串;单双引号皆可
- boolean:布尔;true、false
- null:对象为空
- nudefined:未初始化的默认值
- typeof运算符可以获取数据类型
- 运算符
- 算术运算符:+、-、*、/、%、++、–
- 赋值运算符:=、+=、-=、*=、/=、%=
- 比较运算符:>、<、>=、<=、!=、== 、 ===
- 逻辑运算符:&&、||、!
- 三元运算符:XXX ? XXX : XXX
- == 会进行类型转换
- === 不会进行类型转换
- 字符串转数字:字符串从0位开始到非数字字符前全转为数字,否则NaN
- parseInt(“123”); //123
- parseInt(“12A3”); //12
- parseInt(“A123”); //NaN
- 其他类型转为Boolean
- Number: 0和NaN为false,其他均转为true。
- String:空字符串为false,其他均转为true。
- 00Null和undefined :均转为false。