软件开发知识总结.docx
- 文档编号:30564195
- 上传时间:2023-08-16
- 格式:DOCX
- 页数:28
- 大小:29.77KB
软件开发知识总结.docx
《软件开发知识总结.docx》由会员分享,可在线阅读,更多相关《软件开发知识总结.docx(28页珍藏版)》请在冰豆网上搜索。
软件开发知识总结
软件开发知识总结
HTML
1、什么是HTML?
是一种用来设计网页的标记语言,又叫超文本标记语言,以.html或.htm为后缀,并且由浏览器解释执行,生成相应的界面。
2、HTML的基本结构:
版本信息、head(头,用于描述页面的数据)和body(体,与页面显示的内容有关系)
3、HTML中的单标记有哪些?
、
、、、、、
4、head中有哪些标签,他们的作用是什么?
title:
表示标题
meta:
用于设置消息头(浏览器访问服务器是,服务器会发送的一些键值对)
link:
引入样式
style:
直接设置样式
script:
引入脚本或直接写脚本
5、body中有哪些标签,他们的含义是什么?
h1—h6:
各级标题
p:
段落
span:
同一行元素中的分组,不影响其他元素布局
div:
多行元素的分组,分组后前后会换行
a:
链接
img:
图片
table:
表格
form:
表单
ul、ol:
列表
iframe、frameset:
窗口划分
6、主要的浏览器有哪些:
ie、火狐、googlechrome浏览器、Safari苹果公司浏览器、opera浏览器
7、链接的属性有哪些?
href:
指定链接的地址
target:
指定在哪个窗口打开[_slef:
当前窗口(缺省),_blank新窗口,title:
鼠标放在链接上的提示信息]
8、img的属性
src:
图片的地址
width:
宽度
height:
高度
border:
边框(0表示没有边框)
9、发送邮件的链接是什么?
邮箱地址? subject=主题内容”> 10、锚点是什么,语法是怎样的? 锚点: 实现在页面的内部跳转 11、热点是什么,设置热点的步骤 热点: 使用图片区域作为链接 步骤: step1: 先使用map标记划分图片区域 step2: 使用map 12、表格的基本结构
13、table属性
border:
边框的宽度,单位是像素(缺省值是0)
width:
表格的宽度,可以用百分比(表示该表格占父标记的宽度,也可以是绝对值)
cellpadding:
单元格内容与单元格之间的空隙
cellspacing:
单元格与单元格之间的空隙
14、tr的属性
align:
水平对齐,值有”center/right/left”
15、td的属性
align:
水平对齐,值有”center/right/left”
valign:
垂直对齐,值有”top/middle/bottom”
colspan:
跨列合并单元格
rowspan:
跨行合并单元格
16、表格的完整结构
17、不规则表格
rowspan:
跨行
colspan:
跨列
18、表单是什么?
表单是用来收集用户信息的
19、表单的基本语法
input标记、非input标记
19、表单中的主要标记
input标记:
text:
文本输入框
password:
密码输入框
radio:
单选,同一组单选按钮,name必须相同,checked属性值只有checked,表示缺省被选上
checkbox:
多选
file:
文件上传
submit:
提交按钮,点击提交按钮浏览器默认情况下会将表单中的内容发送给服务器
reset:
重置,浏览器会将输入的数据清空
hidden:
隐藏域,不会在界面上显示出来,一般用于向服务器传送数据
botton:
普通按钮,需要编程实现按钮的功能
非input标记
select:
下拉列表(size默认为1,设其他值为列表框)
textarea:
多行文本域
fieldset:
输入域分组,结合legend元素定义分组标题
legend:
定义分组标题
20、input标记中的属性
type:
input标记的具体类型,默认是文本框
name:
标记的名称,用于生成一个请求参数,不写浏览器则不会将其发送给服务器,对于checkbox、radio而言,用于实现分组
value:
缺省值,对于文本框和密码框:
设置初始文本;对于单选框和多选框:
设置关键数据,往往是id的数据;对于按钮类型:
定义按钮上的文本
21、列表
无序列表:
none(去掉前面的标记)”>
有序列表:
22、窗口划分语法
23、当前窗口中嵌套一个子窗口(常用于广告页面的效果)
CSS
1、什么是css
cascadingstylesheet级联样式表,用统一的方式定义页面的外观,实现页面数据和显示分离
css为网页提供表现的形式,即按照w3c的建议,实现一个比较好的网页设计,应该按照如下的规则:
网页的结构域数据,应该写在.html文件里
网页的表现形式,应该写在.css文件里
网页的行为,应写在.js文件里
这样做的原因是,将网页的数据、表现、行为分离,方便代码的维护
2、什么是css选择器?
定义了如何查找html标记,浏览器会依据选择器,找到匹配的标记,然后施加对应的样式
3、常用的选择器
1)标记选择器(简单选择器)
定义:
标记的名称{
属性名:
属性值;…
}
使用:
<元素>
2)class选择器
匿名的class选择器(标记的class属性值与选择器的名称相等)
定义:
.className{
属性名:
属性值;…
}
使用:
<元素class=”className”>
有名的class选择器(除了标记的class属性值与选择器的名称相等以为,还要求标记的名称匹配)
标记的名称.选择器的名称{
属性名:
属性值;…
}
3)id选择器(标记的id属性值与选择器的名称相等,在同一个html文件当中,id值必须唯一)
定义:
#名称{
属性名:
属性值;…
}
使用:
<元素id=”名称”>
4)选择器的分组:
对以”,”隔开的选择器施加相同的样式
h1,h2,h3{
属性名:
属性值;…
}
5)选择器的派生:
表示id为选择器1的标记内部所有的选择器2的属性值为…
#选择器1选择器2{
属性名:
属性值;
}
4、样式的继承
字标记会继承父标记的式样
5、样式的优先级(从上至下,优先级越来越高)
默认样式:
浏览器默认的样式
外部样式:
样式写在一个.css文件里,使用时页面的head里使用link元素(href/type/rel)引入
内部样式:
样式写在html文件里,样式定义必须有选择器,分离不够彻底,只能在当前页面重用
内联样式:
样式写在标记里,难以重用和维护
6、两个关键属性
display:
none:
不显示该标记,且不占用页面的位置—常用于页面刚初始化时不可见的元素
block:
按块标记的方式显示,独占一行
inline:
按行内标记的方式显示,可以和其他元素同一行,高度和宽度设置无效
position:
static(缺省值):
浏览器在默认情况下会按从左到右,从上到下来依次摆放各个标记
absolute:
绝对定位,相对父标记偏移
relative:
相对定位,先按照默认的方式摆放然后再偏移
7、块标记和行内标记
块标记:
div、p、img、form、table、h1…h6、ul、li
行内标记:
span、strong、a
8、文本常见的属性
font-size:
30px;:
字体大小
font-family:
”宋体”:
字体
font-style:
italic/normal;:
风格
font-weigth:
100;:
粗细,100~900
text-align:
left/center/right;:
对齐方式
text-decoration:
underline;:
加下划线
cursor:
pointer/wait;:
光标的形状
9、背景常见的属性
background-color:
red:
背景颜色
background-imag:
url(images/b1.jpg);:
背景图片
background-repeat:
no-repeat/repeat-x/repeat-y;:
平铺方式
background-position:
20px;:
位置
background-attachment:
fixed/scroll(缺省);:
依附方式
也可以简化成:
background:
颜色、图片…
10、边框常见的属性
border:
1pxsolidred;:
宽度风格颜色
border-left:
border-right:
border-top:
border-bottom:
11、定位常见的属性
width:
100px;:
宽度
height:
100px;:
高度
margin(-left/-right/-top/-bottom):
外边框,可简化为
margin:
30px(顶)、40px(右)、50px(底)、60px(左)
margin:
0px;:
margin:
20pxauto;:
上下各20px,左右平均分配,一般用于居中
padding(-left/-right/-top/-bottom):
内边距(子标记会把父标记撑开)
padding:
30px(顶)、40px(右)、50px(底)、60px(左)
padding:
0px;:
12、列表相关常见的属性
list-style-type:
none;:
取消列表的选项符号
13、浮动常见的属性
浮动:
即取消标记的独占一行的特性,浮动之后,其他位置可以被其他标记使用
float:
left/right;:
浮动到左边或右边
clear:
both;:
取消浮动的影响,告诉浏览器,虽然浮动的标记让出了位置,但不能够使用
14、链接的伪样式
a:
link{color:
red}:
没有访问时
a:
visited{color:
blue}:
访问后
a:
active{color:
lime}:
鼠标点击但还没有放开时
a:
hover{color:
aqua}:
鼠标指向时
JavaScript
1、什么是JavaScript?
一种基于对象和事件驱动的脚本语言,由浏览器软件解释运行,常用于为页面添加一些客户端的动态效果,嵌入到网页
语言的特征:
内置了大量对象,数据的简单封装
2、基础语法:
大小写敏感
标识符:
字母/数字/下划线/$,不能以数字开头
语句:
以;结束
注释:
//、/**/
变量:
var(可以表示任何类型)
运算符:
>>、<<、++、--、?
:
、==(数值,内容)、===(严格相等,内容和类型)
3、数据类型:
(松散类型的语言,声明变量时不能确定数据类型,以赋值为准)
内置数据类型:
String/Number/Boolean/null/undefined
4、String对象:
表示字符串
创建:
vars=‘content’;vars=newString(‘content’);
特殊字符:
\’、\”、\n、\\
方法:
s.length---长度
s.substring(start,end)---子字符串,end是结束位置的下一个
s.charAt(index)
s.indexOf(‘子字符串’)---第一次出现的位置(>=0)
s.lastIndexOf
s.toUpperCase/toLowerCase
s.split(‘拆分用的字符串’)---拆分字符串
5、正则表达式:
结合string对象的方法实现对于字符串的操作,实现对于文本的匹配
/表达式/
s.search(‘子字符’、正则表达式)---index
s.replace(‘子字符’、正则表达式、newstring)---result
s.match()---匹配的数组结果
6、数据类型转换
隐式:
string+number---string
number+boolean---number
string+boolean---string
boolean+boolean---number
显示:
parseInt/parseFloat---转换为数值类型
toString---转换为字符串
判断是否可以转换为数值:
isNaN()---isnotanumber
判断数据类型:
typeof(x)---string/number/boolean/object
7、常用内置对象的用法
(1)数组对象
创建:
vara=newArray();可以没有长度
赋值:
a[0]=’mary’;a[1]=123;a[2]=true;…
简写:
vara=[‘mary’,123,true];
属性:
length
方法:
toString()---1,2,3,
join(‘;’)---1;2;3
a1.concat(a2)---两个数组相加
a1.slice(start,end)---从数组中截取一部分,得到一个小数组
reverse---翻转
sort---排序,默认按照字符串的大小比较
sort(排序的function对象)---自定义排序规则
(2)Math对象:
提供数学计算用的常量和方法
常量:
Math.PI
方法:
max/min/round/pow(x,y)/ceil/floor/random
(3)Date对象:
获取或者操作时间和日期
(4)Function对象
声明方法:
functionName(x,y){…return;}
调用方法:
Name(12,34);
varr=Name(4,true);
局部变量和全局变量
方法的重载:
没有方法的重载,方法重名,即使参数不同,依然以最后一次定义的为准
arguments:
代表当前方法的所有参数值组成的数组,实现类似于重载的效果
8、什么是DOM
documentobjectmodel,将html文档作为一个节点树的结构,查询和修改,实现页面的动态修改---document代表这个文档树,常和正则表达式一起实现页面输入的验证
9、节点类型
根节点:
标记的最顶端,无父节点、无兄弟节点
元素节点:
可以说整个dom模型都是由元素节点构成,他们可以包含其他的元素(elementnode)
文本节点:
当标记里出现javascript,css等这些具体的文本在dom模型中称为文本节点(textnode)
属性节点:
几乎所有的元素都有”name”属性
10、Node常用的属性和方法
属性:
nodeName:
节点名称
nodeValue:
节点值
nodeType:
节点类型(元素节点值为1,属性节点的值为2,文本节点的值为3)
方法:
firstChild():
指向childNodes列表中的一个节点
lastChild():
childNodes():
parentNode():
previouSiling():
指向前一个节点
nextSibling():
指向下一个节点
hasChildNodes():
是否有子节点
attributes():
包含一个元素特性的Attribute对象,仅用于元素节点
appendChild(node):
追加到childNode的末尾
removeChild(node):
移除childNodes节点
insertBefore(newnode,refnode):
在childNodes中的refnode之前插入newnode
11、访问节点
document.getElementByTagName(“tagName”):
访问多个节点
document.getElementById():
访问单个节点
12、检查节点的类型
nodeType:
13、利用父子兄弟关系查找节点
hasChildNodes()/childNodes
14、设置节点属性
getAttribute()/setAttribute()
15、创建和添加节点
创建元素节点:
createElement();
创建文本节点:
createTextNodes();
创建文档碎片节点:
createDocumentFragment();
XXX.appendChild(o);/XXX.insertBefore(a,XXX.firstChild);/XXX.insertBefore(a,XXX.childNodes[1])
16、删除节点
XXX.removeChild(node)---node为XXX的子节点
17、表格的动态创建:
js的客户端技术/服务器端技术,动态的为表格添加新行,行中有单元格
标准的dom操作
封装的HTMLDOM的操作:
tableObj.rows
tableObj.insertRow(index)---返回新产生的tr对象(行对象)
tableObj.deleteRow(index)
rowObj.insertCell(index)---返回新产生的td对象(单元格对象)
.deleteCell(index)
tdObj.innerHTML="";
18、BOM--browserobjectmodel
将浏览器窗口中的各部分封装为对象,树形结构
window
documentlocationhistoryscreennavigatorevent
19、window对象:
代表整个窗口,其他作为它的子对象
document.createXXX
window.document.createXXX
1)window.open(url)--打开多个,返回新窗口对象
window.open(url,name)
window.open(url,name,config)
b)window.focus()
c)window.alert()
window.confirm(text)--确认对话框,返回值bool
window.prompt()--文本输入的对话框
d)定时器的方法
周期性定时器
window.setInterval(function,time)--time是ms单位,返回定时器对象
window.clearInterval(定时器对象)
一次性定时器:
实现类似于倒计时的效果
window.setTimeout(function,time)--time是ms单位,返回定时器对象
window.clearTimeout(定时器对象)
20、location对象:
浏览器窗口的地址栏
location.href="url";---产生保留历史记录
location.replace(url);---不会保留页面的历史
相同点:
旧窗口中显示新的url
location.reload();//F5
去往新的url:
window.open---打开新的窗口
页面的重定向(跳转):
url替换旧的url
21、screen对象
screen.width/height
screen.availWidth/availHeight
screen.color
22、navigator对象:
浏览器软件及其所在操作系统的信息
遍历该对象的所有属性
对象的属性本质是一个属性的数组,如
location.href
location["href"]
navigator.aa
navigator.bb
for(varpinnavigator){
navigator[p]
}
23、event对象
a)事件的分类
键盘事件onkeydown/onkeyup
鼠标事件:
onmouseover/onmouseout/onclick
状态事件onblur/onfocus/onchange/onload/onunload
b)事件的定义
定义在HTML标记里:
onxxx="MM();"---写死
代码动态的为元素定义事件:
obj.onclick=function对象;
24、事件的冒泡机制:
父子元素上定义相同的事件,触发事件时,冒泡机制(从最里层的元素开始触发,层层向上)
取消冒泡:
event.cancelBubble=true;
利用冒泡机制:
大量子元素有相同事件,为父元素定义事件
25、event对象:
只要页面发生了事件,将当前事件相关的所有信息封装到event对象中
js代码中使用event对象
26、eve
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- 软件 开发 知识 总结