标签:赋值 do while absolute interval gen 条件 开头 命令 css
<!doctype html> 声明文档类型,说明html版本号
<html> 说明代码格式
<head> 网页的头部
<meta charset="utf-8"> 定义网页字符集,关键词等内容:例如:<meta name=”keywords” content=”html”>
<title>无标题文档</title> 网页的标题
<link rel="shortcut icon" href="../monkey.ico"> 标题前面的图标
</head>
<body> 网页的主体部分
</body>
</html>
<!--这是注释内容-->
a.标签的写法: <标签名 属性名=”属性值”>内容</标签名>
b.标签可以嵌套:将一个标签作为另一个标签的内容
c.标签特性:①:行标签,不能改变宽高,大小随内容改变,不默认占一行
②:行内块标签:可以设宽高,不默认占一行 <span></span>
③:块标签:可以设宽高,默认占一行 如<div></div>
注意事项:先写完整的标签,再添加内容和属性 所有符号都是英文 注意缩进
<ul>
<li></li>
<li></li>
</ul>
<ol>
<li></li>
<li></li>
</ol>
<a href="" name="top">顶部</a>
<a href="#top">返回顶部</a> 点击返回本页面顶部的位置
普遍文本框:<input type=”text” name=”名称” value=”值:不写value默认为空” />
密码框:<input type=”password” name=”名称” value=”值,不写value默认为空” />
单选按钮:<input type=”radio” name=”一组名称” value=”值” ./>
多选框:<input type=”checkbox” name=”一组名称” value=”值” />
下拉菜单:
<select name=”名称”>
<option value=”值”>描述</option>
<option value=”值”>描述</option>
</select>
提交按钮:<input type=”submit” value=”显示到按钮上名称” />
普通按钮:
<input type=”button” name=”值” value=”名称” />
隐藏域:在浏览器中看不到的传递数据表单
<input type=”hidden” name=”值” value=”值” />
多行文本域:<textarea value=”值” name=”名称”></textarea>
Form标记,是表单域的显示,需要用form标记把表单内容括起来,这个时候才可以提交,原因是form的属性中有:提交方式(get和post)、提交地址(具体提交页面)、上传文件的设置(如果不设置无法上传)
提交地址:action=”具体提交地址”
提交方式:method 值:get和post,在网站中数据直接的传递,只有get和post方式
<table>
<tr>
<th></th> 表头
<th></th>
<th></th>
</tr>
<tr>
<td></td> 单元格
<td></td>
<td></td>
</tr>
</table>
border:边框
cellpadding:内填充(边框到内容的距离) 值:数字
cellspacing:间距(单元格到单元格之间的距离) 值:数字
选择器 {属性名:属性值}
①. 内嵌:将css放到html的<head></head>中:例如:<head><style>div{width:100px;}</啊\style></head>
②. 行内:直接写到标签里面:<div style=”width=’100px’”></div>
③. 外联:引用一个外部的css文件 :<link rel=”stylesheet” type=”text/css” href=”css文件的位置”></link>
①通配符选择器:* 选择所有标签
②元素(标签)选择器:标签名作为选择器
③类选择器:一类元素(class名字相同的一组标签), .class名字
④id选择器:某个元素 #id名字
⑤多元素选择器:div,p,ul{}
⑥后代选择器: 第一代 第二代 第三代... {} 例如: .div p span{}
<div class=”div”>
<p>
<span></span>
</p>
</div>
⑦子类选择器:第一代的(子孙)例如: .div>span{}
<div class=”div”>
<p>
<span></span>
</p>
</div>
⑧伪类选择器:
.div:hover{color:red}
font-size:文字大小 px %
font-family:字体类型
font-style:斜体 italic
font-weight:加粗 bold 100-900
color 文本颜色 3种写法:rgb(0-255,0-255,0-255) 十六进制(#000000-ffffff) 单词(red blue)
text-align 文本水平对齐方式(必须在块元素中) left center right
text-decoration 文本修饰线 underline(下划线) overline(上划线) line-through(删除线) none(a标签删除默认的下划线)
line-height 行高
Width 宽 px %
Height 高 px %
对ul ol进行样式修改
list-style-type 列表前面的符号 none(无)
border 边框
border-bottom 下边框
border-top 上边框
border-left 左边框
border-right 右边框
background-color 背景颜色 3种写法:rgb(0-255,0-255,0-255) 十六进制(#000000-ffffff) 单词(red blue)
background-image 背景图片 url 路径
background-repeat 背景平铺 no-repeat不平埔
background-position 背景定位 x轴和y轴定位 例如:background-position:50px 50px;
background 简写形式 颜色 图片 平铺方式 定位
在html中的每个元素可以是一个盒子形状来存在
外边距:margin 边框:border 填充:padding
padding-top 上内填充 如:padding-top:10px;
padding-right 右内填充 如:padding-right:20px;
padding-bottom 下内填充 如:padding-bottom:30px;
padding-left 左内填充 如:padding-left:40px;
padding 简写形式 padding:10px; //4边都是10
padding:10px 20px; //上下各10.左右各20
padding:10px 20px 30px; 上10,左右各20,下30
padding:10px 20px 30px 40px; 按上右下左的顺序
margin-left 左外边距
margin-right 右外边距
margin-top 上外边距
margin-bottom 下外边距
margin 简写形式:margin:10px; //4边各10
margin:10px 20px; //上下各10,左右各20
margin:10px 20px 30px; //上10,左右各20,下30
margin:10px 20px 30px 40px; //按上右下左的顺序
Float 浮动 left right
position 定位 fixed:固定定位 relative:相对定位 absolute:绝对定位
fixed 以浏览器窗口来定位
relative 定位元素相对与原来的自己进行的定位,原来的位置依然占用
absolute 定位元素相对于他的父级及以上级进行的定位
浏览器的显示效果不一样造成浏览器在显示上有差异
这就要求在网页布局时考虑其兼容性: a,给页面设置最大最小宽
B,在css中设置 *{margin:0px;padding:0px;}
选择器: id>class类>后代>子类>元素(标签)>通配符
形式: 行内>内嵌>外链
overflow hidden 溢出部分隐藏
z-index 元素的叠加层级,值越高显示的层级越高 例如:z-index:10
cursor 鼠标显示效果 例如变小手:cursor:pointer
网页的动态效果
用户和浏览器之间的交互
Html文件与服务器之间的交互
① 嵌套: 可以放在html中,head标签里面,body标签里面......但javascript的代码必须在<script></script>标签中
② 外部引用: <script type=”text/javascript” src=”路径”></script>
① 变量就是计算机中保存数据的容器
② 在javascript中通过关键字var来声明变量
③ 命名规范: 变量名由字母 数字下划线组成 以字母开头 不能用纯数字作为变量名 区分大小写 不要与js的关键字重复
④ 输出变量 alert() 浏览器弹窗输出变量内容
console.log() 在控制台输出
document.wirte() 向body里面写入内容
document.title() 向标题里面写入内容
① 字符串
② 数值类型 整数int 小数float
③ 布尔类型 true false
④ 数组类型
⑤ 对象类型{属性名:属性值} js的变量都是一个对象,当声明一个变量时就创建了一个对象
⑥ Null 空
⑦ Undefine 变量不含有值
① 自动类型转化
当字符串和数值类型的数据,进行加法运算时,数值会自动转化为字符串
Var a=’1’//字符串; var b=1//数值; console.log(a+b);//11 字符串
② 强制类型转化
通过javascript函数,强制转换
number() 将其他类型的数据强制转化为数值
parseInt() 将其他类型的数据转换为整数
parseFloat() 将其他类型的数据转换为小数
string() 将其他类型的数据转换为字符串
boolean() 将其他类型的数据转换为布尔类型
Var str = ‘abc123’;
var num=number(str);//NaN
Var num = parseInt(str);//123
① 算数运算符
+ - * / % ++ --
说明:+可以拼接字符串
++或--在前:先增值或减值,再运算
++或--在后:先运算,再值改变
② 赋值运算符
= += -= *= /= %=
③ 比较运算符
> < == === != !== >= <=
说明:==比较值是否相等
===比较值和数据类型是否相等
④ 逻辑运算符
&&与 || 或 !非
⑤ 三元运算符
条件 ==true ?true执行这里:false执行这里
例如: var result = age>=18 ? ‘可以谈恋爱’:’不能谈恋爱’;
单路分支:if(){}
双路分支:if(){
}else{}
多路分支:
条件是一个范围时:
if(){
}else if(){
}else if(){
}
条件是固定的几个点时:
switch(){
case:
break;
}
嵌套分支:if(){
if(){}
}
循环
for循环:计数循环 遍历数组(索引数组)
while()
do while()
Javascript是基于对象的编程语言,就是由一个一个的对象组成的编程语言
length: 数组的长度,数组元素的个数
concat:合并数组: var arr1=[‘zhangsan’,’lisi’]; var arr2 = [‘wangwu’,’maliu’]
Var arr = arr1.concat(arr2);
join():将数组的元素链接成字符串: var arr1=[‘zhangsan’,’lisi’]; var result = arr1.join(‘@’);
push():向数组的末尾推加元素 var arr1=[‘zhangsan’,’lisi’]; arr1.push(‘wangwu’);
unshift():向数组的开头添加元素
pop():将数组最后一个元素删除 var arr1=[‘zhangsan’,’lisi’]; arr1.pop();
shift():删除数组第一个元素
reverse():颠倒数组的顺序 var arr1=[‘zhangsan’,’lisi’];arr1.reverse();
slice(开始的索引,结束的索引) 截取数组的元素;var arr1=[‘zhangsan’,’lisi’,’wangwu’]; var arr2=slice(0,1);
splice(开始的索引,删除元素的个数,代替删除的内容(可选)) 删除数组的元素
toString() 将数组转化为字符串 var arr1=[‘zhangsan’,’lisi’];var result = arr1.toString();
② 字符串对象常用的方法
indexOf() 获取字符在字符串中第一次出现的位置 也可以着数组元素的位置
例如:var str = “hello”; var index=str.indexOf(o);//index结果为4
lastIndexOf() 获取字符在字符串中最后一次出现的位置
split() 按照分隔符将字符串拆分成数组
例如:var str = “zhangsan@lisi”; var arr = atr.split(“@”);//arr的结果为[‘zhangsan’,’lisi’]
slice() 截取字符串 同数组
substr(开始截取位置,截取长度)
③ 数学对象
Math.abs() 取绝对值
Math.ceil() 向上取整数(取天花板数) 例如:Math.ceil(5.2)结果为6
Math.floor() 向下取整数(取地板数) 例如:Math.ceil(5.2)结果为5
Math.round() 四舍五入取整数
Math.max() 取最大值
Math.min() 取最小值
Math.random() 取0到1之间的随机数
④ 日期对象
Var date=new Date();//日期对象
Var year = date.getFullYear();//年
Var month = date.getMonth()+1//月 值是0到11 所以要加1
getHours()//小时
getMinutes()//分钟
getSeconds()//秒
getTime() 获得当前的时间戳,单位为毫秒
Js里面的dom就是将html里面的标签转化为js的对象(找到对象,操作对象)
document.getElementById
document.getElementsByclass
document.getElementsByname form表单有name属性,所以该方法主要针对的是表单选项
document.getElementsByTagName
Dom为对象:
方法一:dom.属性名 如:dom.id=””;
方法二:dom.setAttribute(‘id’,’age’);//设置id为age
dom.getAttribute(‘id’);//读取id属性的值
dom.removeAttribute(‘id’);//移除id属性
innerText 仅操作标签中文字内容部分
innerHTML 可以操作标签及标签的文字
Dom.style.color........
操作url地址栏
setInterval() 设置定时器//每隔一定时间运行一次
clearInterval() 清除定时器
setTimeout() 设置延迟执行//延迟一定时间后执行一次(就执行一次)
clearTimout() 清除定时器
用户和网页发生交互时的一些行为 鼠标点击 鼠标移入移出 键盘按下 弹起
鼠标事件:
click() 单击
dblclick() 双击
mouseover() 鼠标移入
mouseout() 鼠标移出
mousemove() 鼠标移动
mousedown() 鼠标按下
mouseup() 鼠标松开
scroll 鼠标滚动
键盘事件
keydown 按键按下
keyup 按键弹起
表单事件
submit 表单提交
select 文本框文本被选中
focus 获得焦点
blur 失去焦点
change 内容改变
页面加载完成事件
load
异步的javascript和xml,在不重新加载整个页面的情况下,就可以与服务器交换数据并更新部分网页
① 创建对象的兼容性:
var xhr = new XMLHttpRequest();//这是主流的浏览器
Ie6:new ActiveXObject(“Msxml.HTTP”)
Ie5.5:new ActiveXObject(“Microsoft.HTTP”)
创建对象想兼容别的浏览器可以这样:
var xhr;
try{
xhr = new XMLHttpRequest();
}catch(e){
try{
xhr = new ActiveXObject("Msxml.HTTP");
}catch(e){
try{
Xhr = new ActiveXObject("Microsoft.HTTP");
}catch(e){
}
}
}
②写法
说明:open中的第三个参数可以省略,默认为true(异步),false为同步
Get和post请求的区别:
Get方式请求,在url地址栏传递数据,并且send里面为null,传输的数据比较小2k左右
Post方式请求,需要设置头信息,数据是通过send发送的 传输的数据大小原则上不受限制,可从php配置文件中更改
jQuery是一个javascript函数库,较js代码量更少,更简洁
Id选择器:$(‘#id’)
Class选择器:$(‘.class‘)
元素选择器:$(‘标签名’)
特殊的选择器:$(this)
说明:jqDom为jQuery对象
查询属性:jqDom.attr(属性名)
设置属性:jqDom.attr(属性名,属性值)
删除属性:jqDom.removeAttr(属性名)
说明:jqDom为jQuery对象
获取内容:jqDom.html()
设置内容:jqDom.html(要设置的内容)
获得标签的文本内容:jqDom.text()
设置标签的文本内容:jqDom.text(要设置的文本内容)
获得表单的value值:jqDom.val()
设置表单的value值:jqDom.val(值内容)
说明:jqDom为jQuery对象
jqDom.css(属性名,属性值) 例如:jqDom.css(‘background’,’red’)
$ajax({
url:’li.php’,//请求后台的php页面
data:{type:’init’},//传的参数
type:’post’, //提交数据的方式
dataType:’json’, //返回数据的格式,不填默认为text格式
success:function(data){ //请求成功后返回数据的函数
alert(data);
}
})
①. 注释
单行注释:#注释内容
单行注释:-- 注释内容(两个-后面有个空格)
多行注释:/*注释内容*/
②. 语句
一条语句也称为一条命令,以分号结束,也可以通过’delimiter 新结束符’来修改结束符
③. 大小写:mysql中的系统关键字及命令本身不区分大小写
④. 命名规范
数据库名,表名,字段名,视图名,函数名等等,建议用字母和下划线,字母全用小写
库选项: 字符集 校对集
create database 数据库名字 库选项;
例如:create database school charset utf8;
show databases;
show create database school;
不能修改数据库名,只能修改字符集和校对集
alter database school charset=gbk collate=gbk_chinese_ci;
drop database 数据库名;
use 数据库名;
create table 表名(
字段名1 字段类型 字段选项,
字段名2 字段类型 字段选项,
......
)表选项
例如:create table student(
sno varchar(20) not null primary key comment ‘学号‘,
sname varchar(20) not null ‘学生姓名‘,
ssex varchar(20) not null comment ‘学生性别‘,
sbirthday datetime comment ‘学生出生年月‘,
class varchar(20) comment ‘学生所在班级‘
) charset=utf8 collate=utf8_general_ci;
字段类型:
drop table 表名;
查看所有表:show tables;
查看表结构:desc 表名;
查看创建表语句:show create table 表名;
修改表名:alter table 旧表名 rename[to] 新表名;
添加新字段: alter table 表名 add 新字段 字段类型 字段选项;
修改表字段:alter table 表名 change 旧字段名 新字段名 新字段类型 新字段选项;
删除字段: alter table 表名 drop 字段名;
insert into 表名 [(字段1,字段2....)] values(值1,值2....);
说明:字段名可以省略,省略时values值必须与创建表时的字段顺序一一对应
例如:insert into student values
(108,‘曾华‘,‘男‘,‘1977-09-01‘,95033),
(105,‘匡明‘,‘男‘,‘1975-10-02‘,95031),
(107,‘王丽‘,‘女‘,‘1976-01-23‘,95033),
(101,‘李军‘,‘男‘,‘1976-02-20‘,95033),
(109,‘王芳‘,‘女‘,‘1975-02-10‘,95031),
(103,‘陆君‘,‘男‘,‘1974-06-03‘, 95031);
delete from 表名 where条件 [orde by排序] [limit限定]
update 表名 set 字段名1=值1 ,字段名2=值2.....where 条件;
select 字段列表 [from] 表名 [where] [group by] [having] [order by] [limit];
Where 条件语句中:
算数运算符:+ - * / %
比较运算符:> >= < <= != =
逻辑运算符:and与 or或 not非
in:单独查询某些数据:字段名 in (值1,值2...)
between:字段名 between 小值 and 大值 (表示在小值和大值之间)
like: 模糊查询: like ‘要查询的字符’
like ‘%要查询的字符%’ %代表任意字符
like ‘_要查询的字符_’ _代表一个字符
Group by:分组
Select 字段或聚合函数 from 表名 group by 分组字段;
聚合函数常用的有:取平均值:avg() 取个数:count() 取总和:sum() 取最大值max() 取最小值:min()
Order by:排序
正序:asc 倒序desc
Limit:分页查询 例如:limit 0,3 第一个数是开始数据的下标 第二个数是每次显示的数量
Hypertext Preprocessor 超文本预处理器,是一种开源的脚本语言
<?php 代码?>如果当前页只有php代码时后面的 ?>可以省略
<? 代码?> 短标签 需要更改php的配置文件
<script language=”php”>代码</script>
分号
单行注释://这是注释内容
多行注释:/*这是注释内容*/
存储信息的容器
$变量名 = 变量值; 变量名是字母 数字 下划线组成 不能以数字开头
Php中定义变量时必须给变量赋值
将一个变量放到另一个变量的名字中:$name = ‘zhangsan’; $$name = ‘’;
值传递:将一个变量的值复制一份,然后赋值给另一个变量,此时两个变量是没有任何关系的
例如:$a = 3; $b = $a; 此时$b = 3;
引用传递:将一个变量与其值的引用关系给另一个变量,此时两个变量公用一个引用关系,当一个变量发生改变时,另一个变量也随之改变
例如:$a = 3; $b=&$a; 用&符号取到$a的引用关系
全局变量:在函数外定义的变量
局部变量:在函数内部定义的变量,只能在函数内部有效
isset():判断变量是否存在
unset():删除或销毁变量
empty():判断变量是否为空
echo:将php数据打印
var_dump():打印值 数据类型 长度
Php系统自带的变量,这些变量一般都是超全局变量,超全局变量是可以跨页面的
$GLOBALS:获取当前页面所有变量的内容
$_SERVER:自动获取服务器和客户端的信息,他包含了头信息,路径,及脚本位置等信息
$_FILES:获取上传文件的信息
$_GET:变量用于收集来自 method="get" 的表单中的值
$_POST:变量用于收集来自 method="post" 的表单中的值
$_REQUEST:包含了$_GET和$_POST的全部内容
常量值被定义后,在脚本的其他任何地方都不能被改变
常量的定义:define(常量名,常量值)
使用常量时,直接使用常量名即可
有些常量是随着环境变化会发生改变
__FILE__:当前文件路径和文件名
__DIR__文件所在目录
标量类型:int float string boolean
复合类型:array object
特殊类型:null resource(资源)
html css javascript mysql php学习总结
标签:赋值 do while absolute interval gen 条件 开头 命令 css
原文地址:https://www.cnblogs.com/lsqbk/p/10259175.html