当前位置:首页 > 免费源码

Web前端开发常用词汇

游戏科技网2026年09月14日 23:46免费源码20
描述:style 修饰width 宽度height 高度title 想说明的text-align 水平对齐方式center 居中 left 居左 right 居右line-height 垂直对齐方式/行高 当行高等于高度时候垂直居中background 背景image 引入背景图片(ur…
style 修饰
width 宽度
height 高度
title 想说明的
text-align 水平对齐方式
center 居中 left 居左 right 居右
line-height 垂直对齐方式/行高 当行高等于高度时候垂直居中
background 背景
image 引入背景图片(url)
background-position: 背景定位(x轴,y轴;)
background-repeat 背景平铺
:no-repeat;不平铺 repeat-x;水平平铺 repeat-y;垂直平铺
background:url() repeat left center #00;
顺序:背景图片 重复 定位 颜色
top/right/bottom/left/center 方向英文:上、右、下、左,中
color 颜色
font 文字
font-family 字体
font-size 字号
font-weight:normal 正常 :bold 加粗
font-style: normal;取消倾斜 :italic;斜体
font:italic bold 24px/24px 楷体;
顺序:是否斜体 是否粗体 字体大小/行高 字体
文本修饰属性:
text-decoration:
overline 顶划线
underline 下划线
line-through 中划线/删除线
none 无/取消下划线
display 转化显示模式 元素转化
block 块
inline 行内
inline-block 行内块
省略号
white-space:nowrap 强制不换行
overflow:hidden 溢出隐藏
text-overflow:ellipsis 省略号
font-family:‘微软雅黑’ 让省略号在下面
必须给宽度
伪类
a:link 设置未访问时候的颜色 点击后变成a的正常颜色
a:visited 设置访问过后颜色
a:hover 当鼠标放上去会变颜色
a:active 鼠标点击变颜色
顺序 lvha 驴哈
auto 自动居中
margin 外边距
margin-top 上外边距
margin-right 右外边距
margin-bottom 下外边距
margin-left 左外边距
padding 内边距
padding-top 上内边距
padding-right 右内边距
padding-bottom 下外边距
padding-left 左外边距
float 浮动 :left|right|none 左|右|不浮动
cursor:pointer 小手的代码。。
clear:left|right|both 清除浮动
overflow:hidden 溢出隐藏
index 首页
base 里面写清除默认样式的
text-indent:em 首行缩进 (LOGO名字)
以后logo 必须用H1引背景图片 里面写上字
position:relative|absolute|fixed 定位
relative 相对定位
absolute 绝对定位
fixed 固定定位
Left/top/right/bottom 定位的偏移量
z-index 改变标签z轴堆叠顺序
opacity 透明代码 1不透明(0.9 0.8.。。。。) 0透明
filter:alpha(opacity:0-100
input{outline:none} 取消焦点
<form action="链接" method="">
post 相对安全 gat 不安全
input 表单 单标签
type="text" 账号/文本
type="password" 密码
type="submit" 提交
type="button" 只是一个点击按钮
type="radio" 单选框 label双标签 选项内容
type="checkbox" 复选框 label双标签 选项内容
value="提示 如 请输入密码"
placeholder="也是提示"
select
option 选项栏
textarea 下拉框
resize:none 禁止任意拖放
name="user" 账号
name="password" 密码
table{ border-collapse:collapse;} 让border合并
tr加
colspan="3" 横向合并
rowspan="3" 纵向合并
align 左右对齐方式 middle(左)left center right
valign 上下对齐方式 top center bottom
cellspacing="0" 清除外面的边距
cellpadding="0" 清楚里面的边距
<table cellspacing="0" cellpadding="0">
<thead><tr><th>表头</th></tr></thead>
<tbody><tr><td>表身</td></tr></tbody>
<tfoot><tr><td>表低</td></tr></tfoot>
</table>
frameborder="0" 取消边框
screlling="no" 取消滚动条
iframe src
<frameset>
<frame />
</frameset>
letter-spacing:具体数值 字母间距
word-spacing:数值 单词间距
overflow:auto 溢出滚动
visibility:hidden 隐藏
charset 字符集
utf-8 国际编码
gb2312/gbk 中国编码
author 作者
copyright 版权
keywords 关键词
description 介绍
@media screen and (max-width:900px){}; 屏幕自适应
媒体 屏幕 最大
onlick 当点击的时候
onmouseover 鼠标移入
onmouseout 鼠标移出
复选框操作 checked=" "
checked 默认选中
false 不选中
true 选中
typeof 查看数据类型
object 对象
number 数字
string 字符串
function 函数
boolean 布尔值 true false
undefined 未定义
parseInt 整数
parseFloat 浮点数/小数
Number 数字
hide 隐藏
show 显示
skin 皮肤
code 代码
even 事件
array 数组
integer 整数
veruant 变量
common 公用
switch
case 情况
break 中断整个循环
continue 跳出本次循环
default 不履行/所有情况都不满足的时候走这个
null 没有/空对象
computed 计算后/生效的
eval(JS可以读懂的代码:如‘1+1’->字符串) 这个代码会把()里面的字符串换成计算机读懂的代码来计算 + - * % 都行 (计算用的)
return 返回
write 输入
find 查找
interval 间隔
setInterval(函数名,1000/) 间隔定时器
clearInterval 清除间隔定时器
Timeout 超时
setTimeout 延迟定时器
clearTimeout 清除延迟定时器
obj.disabled 让按钮/变成不可使用
true 不可用
false 可用
date 时间
get 获取
set 设置
Fullyear 满年
month 月 (从0月开始)
day 日 获取需要 date
week 星期 获取需要day (从06
hours 小时
minutes 分钟
seconds 秒
single 一个/一倍
dubble 两个/两倍
triple 三个/三倍
arguments 函数传参-实参的集合
arguments.length 函数传参-实参的长度
arr.push() 向数组最后添加一项
arr.unshift() 向数组前面添加一项
arr.pop()删除数组最后一位.
arr.shift() 删除数组第一位
arr.splice(开始的位置,删除的个数,添加的东西1。。。)
arr.join() 变字符串 是中间的隔开东西 如- ,空格 等等。。。
arr.concat(arr1,arr2,arr..要拼接的数组...); 数组拼接/合并数组
arr.reverse() 反转/颠倒数组
arr.sort() 数组排序 按照字符串比大小的方法来排序
arr.sort(function(a1,a2){ return a1-a2 //从小到大 return a2-a1 //从大到小 }) a1 a2随便起 代表的是数组中随机的某两项
str.charAt() 字符串里面的下标
str.indexOf(‘’) 下字符串对应的下标数(相同的就取第一个)
str.lastIndexOf(‘’)下字符串对应的下标数(相同的就取最后一个)
str.substring (开始位置,结束位置)/(开始位置-不写结束位置默认就从开始位置到最后) 截取子串
str.toUpperCase() 大写字母
str.toLowerCase() 小写字母
str.split(切割的方式 - 空格) 切割变成数组
str.charCodeAt(a) 输入字符查找对应的编码
String.fromCharCode(编码) 输入编码查找对应的字符
json.name=value; 添加
delete json.name 删除
token 括号
try catch(e) 异常
math.random() 求随机数
parseInt(math.random()(m-n)+n) 求n-m之间随机的整数, 前包括后不包括
math.abs() 求绝对值
math.max(,,,) 求最大值
math.min(,,,) 求最小值
math.pow(n,m) 求n的m次方
math.sqrt(a) 开方
math.PI π
math.ceil(12.3) 向上取整 13
math.floor(12.3) 向下取整 12
math.round(a) 四舍五入
!important Css样式值后面加这个 权重最大
navigator.userAgent UA 例子判断浏览器的类型
navigator.language 语言
navigator.platform 操作系统
Sibling 兄弟
next 下一个
previous 上一个
获取元素/节点:
(父级) obj.children 找:儿子/子级 子节点
(子级) obj.parentNode 找:父亲/父级 父节点
*(同级) obj.nextElementSibling || obj.nextSibling 下一个同级/节点
*(同级) obj.previousElementSibling || obj.prenviousSibling 上一个同级/节点
(父级) obj.firstElementChild ||obj.firstChild 首节点
(父级) obj.lastElementChild || obj.lastChild 尾节点
创建元素:
document.createElement(标签名) 创建元素
添加插入
(父级) obj.appendChild() 往元素里面最后添加一个
带剪切效果
(父级) obj.insertBefore(把谁,加在谁的前面) 往元素里面添加一个
带剪切效果
删除元素:
(父级) obj.removeChild(子级) 删除子级
window.open() 打开
window.close() 关闭
a标签:target=""
不填 默认新页面打开
_blank 新页面打开
_self 本页面打开
window.location 地址栏信息
window.location.href 链接信息
window.location.search 数据信息
window.location.hash 锚点信息
*******了解就行 面试背住
window.location.procotol 协议信息
window.location.hostname 域名信息
window.location.port 端口号信息
window.location.pathname 路径信息
back 返回
forward 向前
history 历史
window.history.back 返回历史记录 退
window.history.forward 返回历史记录 前
alert() 弹
confirm 询问提示框
prompt 问答提示框
console.log() 在F12中显示;
document.write(*) 在页面中输入
scroll 滚动 有兼容问题
client 客户端/可视区
offsetHeight/Width 物体盒子模型的宽高
offsetTop/Bottom/方向 物体距上/下/左/右的距离
offsetparent 定位父级
window.onScroll 当滚动的时候 滚动事件
window.onresize 当缩放的时候 缩放事件
onfocus 当获取焦点的时候
onblur 当失去焦点的时候
obj.getAttribute(属性名) 获取属性名对应的属性值
obj.setAttribute(属性名,属性值) 设置属性
obj.removeAttribute(属性名) 删除属性
event 事件
onmousemove 鼠标移动事件
onload 当图片加载完成时
onerror 当图片加载失败时
cancelBubble 取消冒泡
onkeydown 当按键按下的时候
onkeyup 当按键抬起的时候
oEvent.keycode 键盘编码
oncontextmenu 当按右键的时候
return false 阻止浏览器右键菜单
cache 缓存
onmousedown 鼠标按下时
onmouseup 鼠标抬起时
onmousemove 鼠标移动事件
obj.setCapture() 开始捕获
obj.releaseCapture() 取消捕获
obj.cloneNode() 克隆复制一个节点
document/obj.addEventListener不加on的事件名,函数名,false) 添加事件绑定 兼容高级
document/obj.attachEvent加on的事件名,函数名) 添加事件绑定 兼容IE系列
document/obj.removeEventListener不加on的事件名,函数名,false) 解除事件绑定
document/obj.detachEvent加on的事件名,函数名) 解除事件绑定
onmouseenter 鼠标移入
onmouseleave 鼠标移出
onmousewheel 鼠标滚轮事件
DOMMouseScroll 鼠标滚动事件
oEvent.wheelDelta 非火狐 测试鼠标滚轮向上向下弹得数字
oEvent.detail 火狐 测试鼠标滚轮向上向下弹得数字
return false 阻止浏览器默认事件 但是在事件绑定中失效
oEvent.preventDefoult 在事件绑定中用 阻止浏览器默认事件(如果单独用只兼容高级浏览器)
oninput 当输入的时候 iE9- 没有此方法
onpropertychange 当属性改变的时候 IE系列
oEvent.srcElement 事件源 非火狐
oEvent.target 事件源 高级浏览器
duration 期间
start 开始
count 次数
complete 完成
var bFlag=false/ture 开关 自定义
easing 速度类型:
linear 匀速
ease-in 加速
ease-out 减速
window.onload 页面加载完毕后执行(代码、资源)
DOMReady 页面加载完毕后执行(代码)
DOMContentLoaded DOM加载事件
obj.onreadystatechange 监控事件(模拟DOM加载事件)
readyState 加载状态
document/obj.readyState 加载状态
ondbclick 鼠标双击
queryselector 新的获取元素方法
window.location.reload 重新加载
cookie
expires 期限
session 一个会话(浏览器打开和关闭)
path 路径
define 定义
require 引用其他模块
exports 导出模块
module 批量导出模块,
data-main 主要数据/初始化接口
success 成功
error 失败
Request 请求
ActiveX 浏览器插件
XMLHttpRequest() ajax 创建/ 不兼容ie6-
ActiveXObject(Microsoft.XMLHTTP) 创建/(插件) ie系列
oAjax.open()打开
oAjax.setRequestHeader(content-type, application/x-www-form-urlencoded);
oAjax.send() 发送
onreadystatechange 接收/当通信状态变化
oAjax.abort() 使中止
oAjax.readyState 是否完成/加载状态
oAjax.status 是否成功
response 回答/响应
oAjax.responseText 返回结果
JSON.parse() 可以把字符串json变成json 不过json要正规些 双引号
JSON.stringify() json打印出来的方法
encode 编码
decode 解码
Component 组件/元件
encodeURIComponent(中文) 中文转化成编码
decodeURIComponent(编码) 编码转化成中文
str.replace 替换
new RegExp() 正则表达式
str.search() 跟indexOf一样 在正则用
str.match 匹配
正则.test(你要校验的str) true 正确满足 false 不满足 用这个的时候一定配合行首和行尾
转译
\d 数字 [0-9]
\w 数字、英文、下划线 [0-9a-z_]
\s 空白字符 所有的空白字符
. 代表任意字符
\D 非数字 [^0-9]
\W 非数字、英文、下划线 [^0-9a-z_]
\S 非空白字符
\u4e00-\u9fa5 中文
量词
{n} n个
{n,m} n-m个
{n,} 最少n个,最多随便
{0,m} 最少随便 最多m个
{1} 就是 若干个
{0} 任意个 可以没有
{0,1} 最少没有 最多1
\ 转译特殊字符
| 或的意思
i 忽略大小写
g 全局匹配
m 多行模式
^ 行首 如果在方括号里面是除了
$ 行尾
jq
hide 隐藏
show 显示
toggle 点击
hover 移入
fadeIn 淡入
fadeOut 淡出
animate 运动函数(move)
slideDown 滑动从上往下出来
slideUp 滑动从下往上隐藏
eq(下标) 标签获取的下标
li>a li下面的第一级a
伪类选择器:
li:last li最后一个
li:first li第一个
li:eq(2) 第三个li
obj:even 偶数
obj:odd 奇数
obj:has("p/标签名") 里面包含‘p’这个标签的就会选取
obj:contains("p/内容") 内容有得‘p’ 就都会选取
event/自己起行参名字.pageX X轴坐标
event/自己起行参名字.pageY Y轴坐标
offset().top 物体绝对的位置 ->getPos()函数
offset().left 物体绝对的位置
position().top 物体距定位父级距离 ->offsetTop
position().left 物体距定位父级距离
document.scrollTop 和原生一样
document.scrollLeft 和原生一样
.width/.height 物体本身的宽高
innerHeight/Width 物体内部的宽高 包括padding 不包括边框
outerHeight/Width 物体盒子模型宽高
父级.append(子级) 在父级内的后部追加
父级.prepend(子级) 在父级内的前面追加
子级.appendTo(父级) 在父级后部追加
子级.prependTo(父级) 在父级前部追加
obj1.after(obj2)2放在1的后面
obj1.before(obj2)2放在1的前面
bind() 事件绑定
unbind() 事件解绑
live() 事件委托
die() 解除事件委托
**以上四种不推荐 因为原理还是昂 所以推荐on
obj.on() 可以事件绑定/委托
each 循环
$.trim() 去除首尾空格
extend() 延伸
height() 就是宽度
innerHeight 包括padding、不包括边框
outerHeight 盒子模型的
offset().left -> getPos()
position().left -> offsetLeft()
scrollTop() -> scrollTop
eve.pageX/Y 坐标
maxlength 表单元素最大长度 属性
$.fn.函数名=function(){} 建立jq封装函数
$.fn.extend({函数名1:function(){},函数名2:function(){},...})
汉字:[0x4e00,0x9fa5](或十进制[19968,40869]
数字:[0x30,0x39](或十进制[48, 57]
小写字母:[0x61,0x7a](或十进制[97, 122]
大写字母:[0x41,0x5a](或十进制[65, 90]
parent() 父级
offsetParent() 定位父级
parents() 所有父级 括号里面可以筛选 比如放class名字或...
str/arr.slice(开始位置,结束位置) 切 从开始到结束 如果只有开始 就从开始到最后。 前包后不包
prototype 原型
form表单中 submit 提交 reset 重置
xxx instanceOf xxx 检测一个对象属于某个类
xxx.constructor==xxx 看构造函数 双等是判断 直接父级属不属于xxx 一个等号是赋值让直接父级等于xxx
fn.call(this的指向,参数一,参数二,....) 改变this的指向 fn中的this=
fn.apply(this的指向,[参数一,参数二,....]) 改变this的指向 fn中的this=
init 开始
localStorage 本地存储
一般的规范
localStorage.name=value 存
localStorage.name
delete localStorage.name 删除一条
localStorage.clear() 删除全部
规范的存取
localStorage.setItem(name,value)
localStorage.getItem(name)
localStorage.removeItem(name)
sessionStorage 临时存储 和localStorage一样用法
include() 包含
template.defaults.openTag=; 自定义模板开始样子
template.defaults.closeTag=; 自定义模板结束样子
template.config(openTag,)
template.config(closeTag,)
template.config(escape,true/false) true不默认转译 false默认转译
m model 模型
v view 视图
c controller 控制器
scope 范围 作用域
then 然后
model模型
bind绑定
ng-app=""; 引用其他模块
ng-model="" 数据从哪来
ng-bind="" 或 model 或 {{xxx}} 数据到哪去
ng-init 初始化
ng-repeat 循环
angular.module(名字,[依赖模块).controller(名字,function(依赖项){})
$scope
$http
$interval
$timeout
` 反单引号 包住字符串 拼接是这样 ${}
|currency:"" 货币
date:"" 时间戳转化处理
route 路由/状态
filter 过滤器
directive 指令
restrict 类型 E:element C:class M:comment A:attribute
service 依赖
oDate.toString() 获取正常时间
creator.ionic.io 做手机端的框架网站不错
ng-show true false 显示 隐藏
ng-hide true false 隐藏 显示
ng-clack
comment 注释
bundle 打包
transclude 嵌入
params 参数
provider 提供者
.config() 配置
$scope.$watch(数据,fn)
template 模板
templateUrl:模板地址 模板
$ bower install *** 下载东西用的
ReactDOM.render(什么东西,渲染到哪)
type=text/babel
state 状态
extends 延伸 继承
constructor 创建
super 超类/父类
component 组件
React.Component
this.props.**属性
组件中 ref和正常的ID类似
vue
el:id
data:{}
$index
capitalize 首字母大写
uppercase 变大写字母
lowercase 变小写字母
ev.stoppropagation() 阻止冒泡
ev.preventDefault() 阻止默认事件
**angular
angular.bind(this的指向,要改变指向的函数名,参数)
bootstrap 开启应用模式
copy(复制谁,复制到哪里) 复制/克隆
equals(a,b) 比较
forEach 循环
fromJson 字符串json转化成json
extend(obj,obj1,obj2。。。) 扩展
标签里面属性 transition="名字" 过渡 动画
.名字-
transition 过渡
transition:时间 让谁变/all ease;
enter 进来
leave 出去
route 路由/状态
watch 监控
props 存东西 可在替换模板身上用
Router-view 状态视图
v-link="{path:/***}"
emulateJSON:true POST交互加上
cmb
cd
.. 返回上一层
文件夹名 进入下一层
清屏 clear
ls 查看当前文件夹中有什么文件
touch 文件名 新建文件
rm 文件名 删除
vi 文件名 编辑文件
cat 文件名 查看文件内容
mkdir 创建文件夹
rmkir 删除文件夹
echo welcome/** > b.txt 创建文件并写入内容‘welcome’
git init 初始化文件夹变git文件夹
git status 查看当前git状态/工作状态
init 初始
git add .
git commit -m sddadadadad
git push
npm install grunt-cli -g
grunt.loadNpmTasks(grunt-contrib-cssmin); //括号传参插件名字
grunt.initConfig({})
expand:true, //是否分开压缩
options:{ mangle:false}//不损坏
grunt.registerTask(default,[cssmin]); //插件名字
echarts 插件
swiper 滚动的插件
let 让
const 不变的
Array.from(arr) 复制数组
map.entries()
map.keys()
map.values()
import 进口/输入
$a=12; php变量写法
echo **; php输出
<?php //code ?> php的写法
result 结果
varchar 字符(包含数字 字符串等)
fetch 抓取
mysql_connect(服务器名,账号,密码) 连接服务器
mysql_select_db(自己建立的一个服务器名) 选择服务器
SELECT * FROM user WHERE 服务器数据名=数据值 编写sql
mysql_query(填写自己创建的sql名字) 执行抓取数据的sql
mysql_fetch_row(填写执行sql名字) 抓取一个数据
INSERT INTO user VALUES(数据名,数据名) 编写添加数据的sql
node *.js 执行
http.createServer() 创建一个服务器
listen(端口号) 监听
fs.readFile 读取文件的
Buffer 二进制流
from (表示时间)从…; (表示原因)因为; (表示来源)来自…; (表示分离)与…分离[隔开];
form 形状,形式; 外形; 方式; 表格;
when 当
\b 单词边界
onpaste
oncopy 当输入的时候
h5 标签
aside 侧边栏
article 文章
number 数字输入框
min
max
step 控制number每次增加的数值
url 网址
tel 电话
color 颜色 拾色器
range 范围/拖动条
date 选择日期
week 选择周
month 月份
datetime-local
meter 类似进度条
video 视频
controls 默认显示播放等操作控件
autoplay 自动播放
loop 一直播放(播放完了会重新播放循环)
poster 封面
source 放格式的/资源
obj.play() 播放
obj.pause() 暂停
obj.muted 静音
obj.volume 音量
obj.currentTime 快进快退
obj.webkitRequestFullScreen() 全屏
obj.paused 暂停(数值:true/false
obj.currentTime 视频进度时间
obj.duration 视频总时间
obj.currentTime/obj.duration100+% 进度条
obj.paused 值:true/false
audio
controls 默认显示播放等操作控件
autoplay 自动播放
loop 一直播放(播放完了会重新播放循环)
canvas 绘图标签 游戏类的绘图画图之类
webwoker 多线程
js是单线程
websocket
websql 数据库
querySelector 一个
querySelectorAll 一组
classList.add() 追加
classList.remove() 删除
classList.contains() 查看有没有这个class
classList.toggle(*) 有就让没有,没有就让有
ontimeupdate 当时间改变的时候
onended 当结束时候
dataset 一种新的设置自定义属性的方法 --其实性能不如attribute
obj.dataset[*****]= 可以设置也可以获取 data-等自动义属性的一个集合 json
console.time()
//code -> 可以测试中间的代码执行耗时
console.timeEnd(**)
obj.onstorage 当存储的时候
transparent 透明色/继承父级的颜色
radius 半径
border-radius 圆角
css hack
_ ie6识别
box-shadow 阴影
:x偏移量(px) y偏移量(px) 模糊程度blur(px) color
background: 渐变 (-webkit-(是判断浏览器内核,可以省略)) -webkit 谷歌 -moz 火狐 -ms ie
linear 线性渐变
:-webkit-linear-gradient (0deg(方向), color1 25%(渐变开始位置), color2 75%(渐变开始位置))
radial 径向渐变
:-webkit-radial-gradient (left/px top/px, circle(圆形)/ellipse(椭圆), color1 **px,color2 **px)
repeating 秋裤效果/重复创建
:-webkit-repeating-radial-gradient (red **px, yellow px,..)
linear 线性
radial 径向
repeating 重复的
gradient 梯度
circle 圆形
ellipse 椭圆
-webkit-mask 遮罩层/蒙版
-webkit-mask-position 遮罩层/蒙版定位
-webkit-box-reflect 倒影
-webkit-filter:blur(5px)/模糊程度数值; 模糊
:方向 距离/px 渐变-webkit-linear-gradient()
below 下面
contenteditable=true/false 让标签可以输入内容
@keyframes test//名字
animation:8s test/名字 linear infinite/数值/次数;
background-size 背景尺寸
contain 以最合适的状态展示 可能会留白
cover 尽可能填满
nth-child(下标 注意:从1开始) 注意:项目不用这个。禁用
nth-of-type(下标 注意:从1开始) 注意:项目不用这个。禁用
background-origin: 背景从哪里开始
content-box
border-box
padding-box
background-clip: 背景从哪里开切
content-box
border-box
padding-box
text 注意:这个background-clip前面要加上webkit-
style   修饰
width   宽度
height  高度
title   想说明的
text-align 水平对齐方式
center 居中 left 居左 right 居右
line-height 垂直对齐方式/行高  当行高等于高度时候垂直居中
background  背景
image 引入背景图片(url)
background-position: 背景定位(x轴,y轴;)
background-repeat   背景平铺
:no-repeat;不平铺   repeat-x;水平平铺   repeat-y;垂直平铺
background:url() repeat left center #00;
顺序:背景图片 重复 定位 颜色
top/right/bottom/left/center    方向英文:上、右、下、左,中
color   颜色
font 文字
font-family 字体
font-size   字号
font-weight:normal  正常    :bold 加粗
font-style:  normal;取消倾斜   :italic;斜体
font:italic bold 24px/24px 楷体;
顺序:是否斜体 是否粗体 字体大小/行高 字体
文本修饰属性:
text-decoration:
overline    顶划线
underline   下划线
line-through 中划线/删除线
none         无/取消下划线
display 转化显示模式 元素转化
block   块
inline  行内
inline-block    行内块
省略号

white-space:nowrap    强制不换行
overflow:hidden       溢出隐藏
text-overflow:ellipsis 省略号
font-family:‘微软雅黑’  让省略号在下面
必须给宽度
伪类
a:link 设置未访问时候的颜色 点击后变成a的正常颜色
a:visited 设置访问过后颜色
a:hover 当鼠标放上去会变颜色
a:active 鼠标点击变颜色
顺序 lvha 驴哈
auto 自动居中
margin  外边距
margin-top  上外边距
margin-right    右外边距
margin-bottom   下外边距
margin-left 左外边距
padding 内边距
padding-top 上内边距
padding-right   右内边距
padding-bottom  下外边距
padding-left    左外边距
float 浮动 :left|right|none  左|右|不浮动
cursor:pointer  小手的代码。。
clear:left|right|both   清除浮动
overflow:hidden 溢出隐藏
index 首页
base  里面写清除默认样式的
text-indent:em   首行缩进 (LOGO名字)
以后logo 必须用H1引背景图片 里面写上字
position:relative|absolute|fixed    定位
relative 相对定位
absolute 绝对定位
fixed    固定定位
Left/top/right/bottom   定位的偏移量
z-index 改变标签z轴堆叠顺序
opacity 透明代码 1不透明(0.9 0.8.。。。。) 0透明
filter:alpha(opacity:0-100)
input{outline:none} 取消焦点
<form action="链接" method="">
post 相对安全 gat 不安全
input 表单 单标签
type="text"     账号/文本
type="password" 密码
type="submit"   提交
type="button"   只是一个点击按钮
type="radio"    单选框 label双标签 选项内容
type="checkbox" 复选框 label双标签 选项内容
value="提示 如 请输入密码"
placeholder="也是提示"
select
option  选项栏
textarea  下拉框
resize:none 禁止任意拖放
name="user" 账号
name="password" 密码
table{ border-collapse:collapse;} 让border合并
tr加
colspan="3" 横向合并
rowspan="3" 纵向合并
align 左右对齐方式 middle(左)left  center right
valign 上下对齐方式 top center bottom
cellspacing="0" 清除外面的边距
cellpadding="0" 清楚里面的边距
<table cellspacing="0" cellpadding="0">
<thead><tr><th>表头</th></tr></thead>
<tbody><tr><td>表身</td></tr></tbody>
<tfoot><tr><td>表低</td></tr></tfoot>
</table>
frameborder="0" 取消边框
screlling="no" 取消滚动条
iframe src
<frameset>
<frame />
</frameset>
letter-spacing:具体数值 字母间距
word-spacing:数值 单词间距
overflow:auto   溢出滚动
visibility:hidden   隐藏
charset     字符集
utf-8   国际编码
gb2312/gbk  中国编码
author  作者
copyright   版权
keywords    关键词
description 介绍
@media     screen  and (max-width:900px){}; 屏幕自适应
媒体       屏幕          最大
onlick 当点击的时候
onmouseover 鼠标移入
onmouseout  鼠标移出
复选框操作 checked=" "
checked 默认选中
false 不选中
true 选中
typeof 查看数据类型
object 对象
number 数字
string 字符串
function 函数
boolean 布尔值 true false
undefined 未定义
parseInt 整数
parseFloat 浮点数/小数
Number 数字
hide 隐藏
show 显示
skin 皮肤
code 代码
even 事件
array 数组
integer 整数
veruant 变量
common 公用
switch
case 情况
break 中断整个循环
continue 跳出本次循环
default 不履行/所有情况都不满足的时候走这个
null 没有/空对象
computed 计算后/生效的
eval(JS可以读懂的代码:如‘1+1’->字符串) 这个代码会把()里面的字符串换成计算机读懂的代码来计算 + -  * % 都行 (计算用的)
return 返回
write 输入
find 查找
interval 间隔
setInterval(函数名,1000/) 间隔定时器
clearInterval 清除间隔定时器
Timeout 超时
setTimeout 延迟定时器
clearTimeout 清除延迟定时器
obj.disabled 让按钮/变成不可使用
true 不可用
false 可用
date 时间
get 获取
set 设置
Fullyear 满年
month 月 (从0月开始)
day 日 获取需要 date
week 星期 获取需要day (从0到6)
hours 小时
minutes 分钟
seconds 秒
single 一个/一倍
dubble 两个/两倍
triple 三个/三倍
arguments 函数传参-实参的集合
arguments.length  函数传参-实参的长度
arr.push()  向数组最后添加一项
arr.unshift() 向数组前面添加一项
arr.pop()删除数组最后一位.
arr.shift() 删除数组第一位
arr.splice(开始的位置,删除的个数,添加的东西1。。。)
arr.join() 变字符串 是中间的隔开东西 如- ,空格 等等。。。
arr.concat(arr1,arr2,arr..要拼接的数组...); 数组拼接/合并数组
arr.reverse() 反转/颠倒数组
arr.sort() 数组排序 按照字符串比大小的方法来排序
arr.sort(function(a1,a2){ return a1-a2 //从小到大   return a2-a1  //从大到小 }) a1 a2随便起  代表的是数组中随机的某两项
str.charAt() 字符串里面的下标
str.indexOf(‘’) 下字符串对应的下标数(相同的就取第一个)
str.lastIndexOf(‘’)下字符串对应的下标数(相同的就取最后一个)
str.substring (开始位置,结束位置)/(开始位置-不写结束位置默认就从开始位置到最后) 截取子串
str.toUpperCase()  大写字母
str.toLowerCase() 小写字母
str.split(切割的方式 -  空格等) 切割变成数组
str.charCodeAt(a) 输入字符查找对应的编码
String.fromCharCode(编码) 输入编码查找对应的字符
json.name=value; 添加
delete json.name  删除
token 括号
try catch(e) 异常
math.random() 求随机数
parseInt(math.random()(m-n)+n) 求n-m之间随机的整数, 前包括后不包括
math.abs()  求绝对值
math.max(,,,)  求最大值
math.min(,,,)  求最小值
math.pow(n,m)       求n的m次方
math.sqrt(a)   开方
math.PI     π
math.ceil(12.3) 向上取整 13
math.floor(12.3)    向下取整 12
math.round(a)    四舍五入
!important Css样式值后面加这个 权重最大
navigator.userAgent  UA 例子判断浏览器的类型
navigator.language 语言
navigator.platform 操作系统
Sibling 兄弟
next 下一个
previous 上一个
获取元素/节点:
(父级) obj.children    找:儿子/子级  子节点
(子级) obj.parentNode  找:父亲/父级  父节点
*(同级) obj.nextElementSibling || obj.nextSibling  下一个同级/节点
*(同级) obj.previousElementSibling || obj.prenviousSibling 上一个同级/节点
(父级) obj.firstElementChild ||obj.firstChild  首节点
(父级) obj.lastElementChild || obj.lastChild   尾节点
创建元素:
document.createElement(标签名) 创建元素
添加插入
(父级) obj.appendChild(谁)  往元素里面最后添加一个
带剪切效果
(父级) obj.insertBefore(把谁,加在谁的前面)  往元素里面添加一个
带剪切效果
删除元素:
(父级) obj.removeChild(子级) 删除子级
window.open() 打开
window.close() 关闭
a标签:target=""
不填 默认新页面打开
_blank 新页面打开
_self 本页面打开
window.location 地址栏信息
window.location.href 链接信息
window.location.search 数据信息
window.location.hash  锚点信息
*******了解就行 面试背住
window.location.procotol  协议信息
window.location.hostname  域名信息
window.location.port  端口号信息
window.location.pathname  路径信息
back 返回
forward 向前
history 历史
window.history.back 返回历史记录 退
window.history.forward 返回历史记录 前
alert() 弹
confirm 询问提示框
prompt 问答提示框
console.log() 在F12中显示;
document.write(*) 在页面中输入
scroll 滚动   有兼容问题
client 客户端/可视区
offsetHeight/Width  物体盒子模型的宽高
offsetTop/Bottom/方向  物体距上/下/左/右的距离
offsetparent 定位父级
window.onScroll 当滚动的时候 滚动事件
window.onresize 当缩放的时候 缩放事件
onfocus 当获取焦点的时候
onblur  当失去焦点的时候
obj.getAttribute(属性名)  获取属性名对应的属性值
obj.setAttribute(属性名,属性值)  设置属性
obj.removeAttribute(属性名)        删除属性
event 事件
onmousemove 鼠标移动事件
onload 当图片加载完成时
onerror 当图片加载失败时
cancelBubble 取消冒泡
onkeydown 当按键按下的时候
onkeyup 当按键抬起的时候
oEvent.keycode 键盘编码
oncontextmenu 当按右键的时候
return false 阻止浏览器右键菜单
cache 缓存
onmousedown 鼠标按下时
onmouseup   鼠标抬起时
onmousemove 鼠标移动事件
obj.setCapture() 开始捕获
obj.releaseCapture() 取消捕获
obj.cloneNode() 克隆复制一个节点
document/obj.addEventListener(不加on的事件名,函数名,false) 添加事件绑定  兼容高级
document/obj.attachEvent(加on的事件名,函数名) 添加事件绑定  兼容IE系列
document/obj.removeEventListener(不加on的事件名,函数名,false) 解除事件绑定
document/obj.detachEvent(加on的事件名,函数名) 解除事件绑定
onmouseenter 鼠标移入
onmouseleave 鼠标移出
onmousewheel 鼠标滚轮事件
DOMMouseScroll 鼠标滚动事件
oEvent.wheelDelta 非火狐 测试鼠标滚轮向上向下弹得数字
oEvent.detail 火狐 测试鼠标滚轮向上向下弹得数字
return false 阻止浏览器默认事件 但是在事件绑定中失效
oEvent.preventDefoult 在事件绑定中用  阻止浏览器默认事件(如果单独用只兼容高级浏览器)
oninput 当输入的时候  iE9-  没有此方法
onpropertychange 当属性改变的时候 IE系列
oEvent.srcElement 事件源 非火狐
oEvent.target 事件源 高级浏览器
duration 期间
start 开始
count 次数
complete 完成
var bFlag=false/ture 开关 自定义
easing 速度类型:
linear 匀速
ease-in 加速
ease-out 减速
window.onload 页面加载完毕后执行(代码、资源)
DOMReady 页面加载完毕后执行(代码)
DOMContentLoaded DOM加载事件
obj.onreadystatechange 监控事件(模拟DOM加载事件)
readyState 加载状态
document/obj.readyState 加载状态
ondbclick 鼠标双击
queryselector 新的获取元素方法
window.location.reload 重新加载
cookie

expires 期限
session 一个会话(浏览器打开和关闭)
path 路径
define  定义
require 引用其他模块
exports 导出模块
module 批量导出模块,
data-main 主要数据/初始化接口
success 成功
error  失败
Request 请求
ActiveX 浏览器插件
XMLHttpRequest()  ajax 创建/  不兼容ie6-
ActiveXObject(Microsoft.XMLHTTP) 创建/(插件)  ie系列
oAjax.open()打开
oAjax.setRequestHeader(content-type, application/x-www-form-urlencoded);
oAjax.send() 发送
onreadystatechange 接收/当通信状态变化
oAjax.abort() 使中止
oAjax.readyState 是否完成/加载状态
oAjax.status 是否成功
response 回答/响应
oAjax.responseText 返回结果
JSON.parse() 可以把字符串json变成json 不过json要正规些 双引号
JSON.stringify() json打印出来的方法
encode 编码
decode 解码
Component 组件/元件
encodeURIComponent(中文) 中文转化成编码
decodeURIComponent(编码) 编码转化成中文
str.replace 替换
new RegExp() 正则表达式
str.search() 跟indexOf一样 在正则用
str.match 匹配

正则.test(你要校验的str) true 正确满足 false 不满足 用这个的时候一定配合行首和行尾
转译
\d 数字 [0-9]
\w 数字、英文、下划线 [0-9a-z_]
\s 空白字符 所有的空白字符
.  代表任意字符
\D 非数字 [^0-9]
\W 非数字、英文、下划线 [^0-9a-z_]
\S 非空白字符
\u4e00-\u9fa5 中文
量词
{n} n个
{n,m} n-m个
{n,} 最少n个,最多随便
{0,m} 最少随便 最多m个
{1,} 就是 若干个
{0,} 任意个 可以没有
?  {0,1} 最少没有 最多1个
\ 转译特殊字符
| 或的意思
i 忽略大小写
g 全局匹配
m 多行模式
^ 行首 如果在方括号里面是除了
$ 行尾
jq

hide 隐藏
show 显示
toggle 点击
hover 移入
fadeIn 淡入
fadeOut 淡出
animate 运动函数(move)
slideDown 滑动从上往下出来
slideUp 滑动从下往上隐藏
eq(下标) 标签获取的下标
li>a  li下面的第一级a
伪类选择器:
li:last li最后一个
li:first li第一个
li:eq(2) 第三个li
obj:even 偶数
obj:odd 奇数
obj:has("p/标签名") 里面包含‘p’这个标签的就会选取
obj:contains("p/内容") 内容有得‘p’ 就都会选取
event/自己起行参名字.pageX   X轴坐标
event/自己起行参名字.pageY   Y轴坐标
offset().top   物体绝对的位置 ->getPos()函数
offset().left  物体绝对的位置
position().top 物体距定位父级距离 ->offsetTop
position().left 物体距定位父级距离
document.scrollTop 和原生一样
document.scrollLeft  和原生一样
.width/.height 物体本身的宽高
innerHeight/Width  物体内部的宽高 包括padding 不包括边框
outerHeight/Width  物体盒子模型宽高
父级.append(子级) 在父级内的后部追加
父级.prepend(子级) 在父级内的前面追加
子级.appendTo(父级) 在父级后部追加
子级.prependTo(父级) 在父级前部追加
obj1.after(obj2) 把2放在1的后面
obj1.before(obj2) 把2放在1的前面
bind() 事件绑定
unbind() 事件解绑
live() 事件委托
die() 解除事件委托
**以上四种不推荐 因为原理还是昂 所以推荐on
obj.on() 可以事件绑定/委托
each 循环
$.trim() 去除首尾空格

extend() 延伸
height()      就是宽度
innerHeight    包括padding、不包括边框
outerHeight    盒子模型的
offset().left     ->   getPos()
position().left    ->   offsetLeft()
scrollTop()      -> scrollTop
eve.pageX/Y  坐标
maxlength 表单元素最大长度 属性
$.fn.函数名=function(){} 建立jq封装函数
$.fn.extend({函数名1:function(){},函数名2:function(){},...})

汉字:[0x4e00,0x9fa5](或十进制[19968,40869])
数字:[0x30,0x39](或十进制[48, 57])
小写字母:[0x61,0x7a](或十进制[97, 122])
大写字母:[0x41,0x5a](或十进制[65, 90])
parent() 父级
offsetParent() 定位父级
parents() 所有父级 括号里面可以筛选 比如放class名字或...
str/arr.slice(开始位置,结束位置)  切 从开始到结束 如果只有开始 就从开始到最后。 前包后不包
prototype 原型
form表单中 submit 提交 reset 重置
xxx instanceOf xxx 检测一个对象属于某个类
xxx.constructor==xxx 看构造函数 双等是判断 直接父级属不属于xxx 一个等号是赋值让直接父级等于xxx
fn.call(this的指向,参数一,参数二,....) 改变this的指向 fn中的this=
fn.apply(this的指向,[参数一,参数二,....]) 改变this的指向 fn中的this=
init 开始
localStorage 本地存储
一般的规范
localStorage.name=value  存
localStorage.name 取
delete localStorage.name 删除一条
localStorage.clear() 删除全部
规范的存取
localStorage.setItem(name,value)
localStorage.getItem(name)
localStorage.removeItem(name)
sessionStorage 临时存储 和localStorage一样用法
include() 包含
template.defaults.openTag=; 自定义模板开始样子
template.defaults.closeTag=; 自定义模板结束样子
template.config(openTag,)
template.config(closeTag,)
template.config(escape,true/false) true不默认转译 false默认转译
m model 模型
v view 视图
c controller 控制器
scope 范围 作用域
then 然后
model模型
bind绑定
ng-app=""; 引用其他模块
ng-model="" 数据从哪来
ng-bind=""  或 model 或 {{xxx}} 数据到哪去
ng-init 初始化
ng-repeat 循环
angular.module(名字,[依赖模块).controller(名字,function(依赖项){})
$scope
$http
$interval
$timeout
` 反单引号 包住字符串 拼接是这样 ${}
|currency:"" 货币
date:"" 时间戳转化处理
route 路由/状态
filter 过滤器
directive 指令
restrict 类型 E:element C:class M:comment A:attribute
service 依赖
oDate.toString() 获取正常时间
creator.ionic.io 做手机端的框架网站不错
ng-show true false  显示 隐藏
ng-hide true false  隐藏 显示
ng-clack
comment 注释
bundle 打包
transclude 嵌入
params 参数
provider 提供者
.config() 配置
$scope.$watch(数据,fn)
template 模板
templateUrl:模板地址 模板
$ bower install *** 下载东西用的
ReactDOM.render(什么东西,渲染到哪)
type=text/babel
state 状态
extends 延伸 继承
constructor 创建
super 超类/父类
component  组件
React.Component
this.props.**属性
组件中 ref和正常的ID类似
vue

el:id
data:{}
$index
capitalize 首字母大写
uppercase 变大写字母
lowercase 变小写字母
ev.stoppropagation() 阻止冒泡
ev.preventDefault()  阻止默认事件
**angular
angular.bind(this的指向,要改变指向的函数名,参数)
bootstrap 开启应用模式
copy(复制谁,复制到哪里) 复制/克隆
equals(a,b) 比较
forEach 循环
fromJson 字符串json转化成json
extend(obj,obj1,obj2。。。) 扩展
标签里面属性 transition="名字" 过渡 动画
.名字-
transition 过渡
transition:时间 让谁变/all ease;
enter 进来
leave 出去
route 路由/状态
watch 监控
props 存东西 可在替换模板身上用
Router-view 状态视图
v-link="{path:/***}"
emulateJSON:true POST交互加上
cmb
cd
.. 返回上一层
文件夹名 进入下一层
清屏 clear
ls   查看当前文件夹中有什么文件
touch 文件名 新建文件
rm 文件名 删除
vi 文件名 编辑文件
cat 文件名 查看文件内容
mkdir 创建文件夹
rmkir 删除文件夹
echo welcome/** > b.txt 创建文件并写入内容‘welcome’
git init 初始化文件夹变git文件夹
git status 查看当前git状态/工作状态
init 初始
git add .
git commit -m sddadadadad
git push
npm install grunt-cli -g
grunt.loadNpmTasks(grunt-contrib-cssmin); //括号传参插件名字
grunt.initConfig({})
expand:true,  //是否分开压缩
options:{ mangle:false}//不损坏
grunt.registerTask(default,[cssmin]); //插件名字
echarts 插件
swiper 滚动的插件
let 让
const 不变的
Array.from(arr) 复制数组
map.entries()
map.keys()
map.values()
import 进口/输入
$a=12; php变量写法
echo **;  php输出
<?php   //code ?>   php的写法
result 结果
varchar 字符(包含数字 字符串等)
fetch 抓取
mysql_connect(服务器名,账号,密码) 连接服务器
mysql_select_db(自己建立的一个服务器名) 选择服务器
SELECT * FROM user WHERE 服务器数据名=数据值   编写sql
mysql_query(填写自己创建的sql名字) 执行抓取数据的sql
mysql_fetch_row(填写执行sql名字)  抓取一个数据
INSERT INTO user VALUES(数据名,数据名) 编写添加数据的sql
node *.js 执行
http.createServer() 创建一个服务器
listen(端口号) 监听
fs.readFile 读取文件的
Buffer 二进制流
from (表示时间)从…; (表示原因)因为; (表示来源)来自…; (表示分离)与…分离[隔开];
form  形状,形式; 外形; 方式; 表格;
when 当
\b  单词边界
onpaste
oncopy  当输入的时候

h5 标签
aside 侧边栏
article 文章
number 数字输入框
min
max
step 控制number每次增加的数值
url 网址
tel 电话
color 颜色 拾色器
range 范围/拖动条
date 选择日期
week 选择周
month 月份
datetime-local
meter 类似进度条
video 视频
controls 默认显示播放等操作控件
autoplay 自动播放
loop 一直播放(播放完了会重新播放循环)
poster 封面
source 放格式的/资源
obj.play() 播放
obj.pause() 暂停
obj.muted 静音
obj.volume 音量
obj.currentTime 快进快退
obj.webkitRequestFullScreen() 全屏
obj.paused 暂停(数值:true/false)
obj.currentTime 视频进度时间
obj.duration 视频总时间
obj.currentTime/obj.duration100+% 进度条
obj.paused 值:true/false
audio
controls 默认显示播放等操作控件
autoplay 自动播放
loop 一直播放(播放完了会重新播放循环)
canvas 绘图标签 游戏类的绘图画图之类
webwoker 多线程
js是单线程
websocket
websql 数据库
querySelector 一个
querySelectorAll 一组
classList.add() 追加
classList.remove() 删除
classList.contains() 查看有没有这个class
classList.toggle(*) 有就让没有,没有就让有

ontimeupdate 当时间改变的时候
onended 当结束时候
dataset 一种新的设置自定义属性的方法 --其实性能不如attribute
obj.dataset[*****]= 可以设置也可以获取 data-等自动义属性的一个集合 json
console.time()
//code       -> 可以测试中间的代码执行耗时
console.timeEnd(**)
obj.onstorage 当存储的时候
transparent 透明色/继承父级的颜色
radius 半径
border-radius 圆角
css hack
_ ie6识别
box-shadow 阴影
:x偏移量(px) y偏移量(px) 模糊程度blur(px) color

background: 渐变  (-webkit-(是判断浏览器内核,可以省略))   -webkit 谷歌  -moz  火狐    -ms ie
linear 线性渐变
:-webkit-linear-gradient (0deg(方向), color1 25%(渐变开始位置), color2 75%(渐变开始位置))
radial 径向渐变
:-webkit-radial-gradient (left/px top/px, circle(圆形)/ellipse(椭圆), color1 **px,color2 **px)
repeating 秋裤效果/重复创建
:-webkit-repeating-radial-gradient (red **px, yellow px,..)
linear 线性
radial 径向
repeating 重复的
gradient 梯度
circle  圆形
ellipse 椭圆
-webkit-mask 遮罩层/蒙版
-webkit-mask-position 遮罩层/蒙版定位
-webkit-box-reflect 倒影
-webkit-filter:blur(5px)/模糊程度数值;   模糊
:方向  距离/px  渐变-webkit-linear-gradient()
below 下面
contenteditable=true/false  让标签可以输入内容
@keyframes test//名字
animation:8s test/名字  linear infinite/数值/次数;
background-size 背景尺寸
contain 以最合适的状态展示 可能会留白
cover 尽可能填满
nth-child(下标 注意:从1开始)   注意:项目不用这个。禁用
nth-of-type(下标 注意:从1开始) 注意:项目不用这个。禁用
background-origin:  背景从哪里开始
content-box
border-box
padding-box
background-clip:    背景从哪里开切
content-box
border-box
padding-box
text 注意:这个background-clip前面要加上webkit-
style修饰width宽度height高度title想说明的text-align 水平对齐方式center 居中 left 居左 right 居右line-height 垂直对齐方式/行高当行高等于高度时候垂直居中background背景image 引入背景图片(url)background-position: 背景定位(x轴,y轴;)background-repeat背景平铺:no-repeat;不平铺repeat-x;水平平铺repeat-y;垂直平铺background:url() repeat left center #00;顺序:背景图片 重复 定位 颜色top/right/bottom/left/center方向英文:上、右、下、左,中color颜色font 文字font-family 字体font-size字号font-weight:normal正常:bold 加粗font-style:normal;取消倾斜:italic;斜体font:italic bold 24px/24px 楷体;顺序:是否斜体 是否粗体 字体大小/行高 字体文本修饰属性:text-decoration:overline顶划线underline下划线line-through 中划线/删除线none无/取消下划线display 转化显示模式 元素转化block块inline行内inline-block行内块省略号white-space:nowrap强制不换行overflow:hidden溢出隐藏text-overflow:ellipsis 省略号font-family:‘微软雅黑’让省略号在下面必须给宽度伪类a:link 设置未访问时候的颜色 点击后变成a的正常颜色a:visited 设置访问过后颜色a:hover 当鼠标放上去会变颜色a:active 鼠标点击变颜色顺序 lvha 驴哈auto 自动居中margin外边距margin-top上外边距margin-right右外边距margin-bottom下外边距margin-left 左外边距padding 内边距padding-top 上内边距padding-right右内边距padding-bottom下外边距padding-left左外边距float 浮动 :left|right|none左|右|不浮动cursor:pointer小手的代码。。clear:left|right|both清除浮动overflow:hidden 溢出隐藏index 首页base里面写清除默认样式的text-indent:em首行缩进 (LOGO名字)以后logo 必须用H1引背景图片 里面写上字position:relative|absolute|fixed定位relative 相对定位absolute 绝对定位fixed固定定位Left/top/right/bottom定位的偏移量z-index 改变标签z轴堆叠顺序opacity 透明代码 1不透明(0.9 0.8.。。。。) 0透明filter:alpha(opacity:0-100)input{outline:none} 取消焦点<form action="链接" method="">post 相对安全 gat 不安全input 表单 单标签type="text"账号/文本type="password" 密码type="submit"提交type="button"只是一个点击按钮type="radio"单选框 label双标签 选项内容type="checkbox" 复选框 label双标签 选项内容value="提示 如 请输入密码"placeholder="也是提示"selectoption选项栏textarea下拉框resize:none 禁止任意拖放name="user" 账号name="password" 密码table{ border-collapse:collapse;} 让border合并tr加colspan="3" 横向合并rowspan="3" 纵向合并align 左右对齐方式 middle(左)leftcenter rightvalign 上下对齐方式 top center bottomcellspacing="0" 清除外面的边距cellpadding="0" 清楚里面的边距<table cellspacing="0" cellpadding="0"><thead><tr><th>表头</th></tr></thead><tbody><tr><td>表身</td></tr></tbody><tfoot><tr><td>表低</td></tr></tfoot></table>frameborder="0" 取消边框screlling="no" 取消滚动条iframe src<frameset><frame /></frameset>letter-spacing:具体数值 字母间距word-spacing:数值 单词间距overflow:auto溢出滚动visibility:hidden隐藏charset字符集utf-8国际编码gb2312/gbk中国编码author作者copyright版权keywords关键词description 介绍@mediascreenand (max-width:900px){}; 屏幕自适应媒体屏幕最大onlick 当点击的时候onmouseover 鼠标移入onmouseout鼠标移出复选框操作 checked=" "checked 默认选中false 不选中true 选中typeof 查看数据类型object 对象number 数字string 字符串function 函数boolean 布尔值 true falseundefined 未定义parseInt 整数parseFloat 浮点数/小数Number 数字hide 隐藏show 显示skin 皮肤code 代码even 事件array 数组integer 整数veruant 变量common 公用switchcase 情况break 中断整个循环continue 跳出本次循环default 不履行/所有情况都不满足的时候走这个null 没有/空对象computed 计算后/生效的eval(JS可以读懂的代码:如‘1+1’->字符串) 这个代码会把()里面的字符串换成计算机读懂的代码来计算 + -* % 都行 (计算用的)return 返回write 输入find 查找interval 间隔setInterval(函数名,1000/) 间隔定时器clearInterval 清除间隔定时器Timeout 超时setTimeout 延迟定时器clearTimeout 清除延迟定时器obj.disabled 让按钮/变成不可使用true 不可用false 可用date 时间get 获取set 设置Fullyear 满年month 月 (从0月开始)day 日 获取需要 dateweek 星期 获取需要day (从0到6)hours 小时minutes 分钟seconds 秒single 一个/一倍dubble 两个/两倍triple 三个/三倍arguments 函数传参-实参的集合arguments.length函数传参-实参的长度arr.push()向数组最后添加一项arr.unshift() 向数组前面添加一项arr.pop()删除数组最后一位.arr.shift() 删除数组第一位arr.splice(开始的位置,删除的个数,添加的东西1。。。)arr.join() 变字符串 是中间的隔开东西 如- ,空格 等等。。。arr.concat(arr1,arr2,arr..要拼接的数组...); 数组拼接/合并数组arr.reverse() 反转/颠倒数组arr.sort() 数组排序 按照字符串比大小的方法来排序arr.sort(function(a1,a2){ return a1-a2 //从小到大return a2-a1//从大到小 }) a1 a2随便起代表的是数组中随机的某两项str.charAt() 字符串里面的下标str.indexOf(‘’) 下字符串对应的下标数(相同的就取第一个)str.lastIndexOf(‘’)下字符串对应的下标数(相同的就取最后一个)str.substring (开始位置,结束位置)/(开始位置-不写结束位置默认就从开始位置到最后) 截取子串str.toUpperCase()大写字母str.toLowerCase() 小写字母str.split(切割的方式 -空格等) 切割变成数组str.charCodeAt(a) 输入字符查找对应的编码String.fromCharCode(编码) 输入编码查找对应的字符json.name=value; 添加delete json.name删除token 括号try catch(e) 异常math.random() 求随机数parseInt(math.random()(m-n)+n) 求n-m之间随机的整数, 前包括后不包括math.abs()求绝对值math.max(,,,)求最大值math.min(,,,)求最小值math.pow(n,m)求n的m次方math.sqrt(a)开方math.PIπmath.ceil(12.3) 向上取整 13math.floor(12.3)向下取整 12math.round(a)四舍五入!important Css样式值后面加这个 权重最大navigator.userAgentUA 例子判断浏览器的类型navigator.language 语言navigator.platform 操作系统Sibling 兄弟next 下一个previous 上一个获取元素/节点:(父级) obj.children找:儿子/子级子节点(子级) obj.parentNode找:父亲/父级父节点*(同级) obj.nextElementSibling || obj.nextSibling下一个同级/节点*(同级) obj.previousElementSibling || obj.prenviousSibling 上一个同级/节点(父级) obj.firstElementChild ||obj.firstChild首节点(父级) obj.lastElementChild || obj.lastChild尾节点创建元素:document.createElement(标签名) 创建元素添加插入(父级) obj.appendChild(谁)往元素里面最后添加一个带剪切效果(父级) obj.insertBefore(把谁,加在谁的前面)往元素里面添加一个带剪切效果删除元素:(父级) obj.removeChild(子级) 删除子级window.open() 打开window.close() 关闭a标签:target=""不填 默认新页面打开_blank 新页面打开_self 本页面打开window.location 地址栏信息window.location.href 链接信息window.location.search 数据信息window.location.hash锚点信息*******了解就行 面试背住window.location.procotol协议信息window.location.hostname域名信息window.location.port端口号信息window.location.pathname路径信息back 返回forward 向前history 历史window.history.back 返回历史记录 退window.history.forward 返回历史记录 前alert() 弹confirm 询问提示框prompt 问答提示框console.log() 在F12中显示;document.write(*) 在页面中输入scroll 滚动有兼容问题client 客户端/可视区offsetHeight/Width物体盒子模型的宽高offsetTop/Bottom/方向物体距上/下/左/右的距离offsetparent 定位父级window.onScroll 当滚动的时候 滚动事件window.onresize 当缩放的时候 缩放事件onfocus 当获取焦点的时候onblur当失去焦点的时候obj.getAttribute(属性名)获取属性名对应的属性值obj.setAttribute(属性名,属性值)设置属性obj.removeAttribute(属性名)删除属性event 事件onmousemove 鼠标移动事件onload 当图片加载完成时onerror 当图片加载失败时cancelBubble 取消冒泡onkeydown 当按键按下的时候onkeyup 当按键抬起的时候oEvent.keycode 键盘编码oncontextmenu 当按右键的时候return false 阻止浏览器右键菜单cache 缓存onmousedown 鼠标按下时onmouseup鼠标抬起时onmousemove 鼠标移动事件obj.setCapture() 开始捕获obj.releaseCapture() 取消捕获obj.cloneNode() 克隆复制一个节点document/obj.addEventListener(不加on的事件名,函数名,false) 添加事件绑定兼容高级document/obj.attachEvent(加on的事件名,函数名) 添加事件绑定兼容IE系列document/obj.removeEventListener(不加on的事件名,函数名,false) 解除事件绑定document/obj.detachEvent(加on的事件名,函数名) 解除事件绑定onmouseenter 鼠标移入onmouseleave 鼠标移出onmousewheel 鼠标滚轮事件DOMMouseScroll 鼠标滚动事件oEvent.wheelDelta 非火狐 测试鼠标滚轮向上向下弹得数字oEvent.detail 火狐 测试鼠标滚轮向上向下弹得数字return false 阻止浏览器默认事件 但是在事件绑定中失效oEvent.preventDefoult 在事件绑定中用阻止浏览器默认事件(如果单独用只兼容高级浏览器)oninput 当输入的时候iE9-没有此方法onpropertychange 当属性改变的时候 IE系列oEvent.srcElement 事件源 非火狐oEvent.target 事件源 高级浏览器duration 期间start 开始count 次数complete 完成var bFlag=false/ture 开关 自定义easing 速度类型:linear 匀速ease-in 加速ease-out 减速window.onload 页面加载完毕后执行(代码、资源)DOMReady 页面加载完毕后执行(代码)DOMContentLoaded DOM加载事件obj.onreadystatechange 监控事件(模拟DOM加载事件)readyState 加载状态document/obj.readyState 加载状态ondbclick 鼠标双击queryselector 新的获取元素方法window.location.reload 重新加载cookieexpires 期限session 一个会话(浏览器打开和关闭)path 路径define定义require 引用其他模块exports 导出模块module 批量导出模块,data-main 主要数据/初始化接口success 成功error失败Request 请求ActiveX 浏览器插件XMLHttpRequest()ajax 创建/不兼容ie6-ActiveXObject(Microsoft.XMLHTTP) 创建/(插件)ie系列oAjax.open()打开oAjax.setRequestHeader(content-type, application/x-www-form-urlencoded);oAjax.send() 发送onreadystatechange 接收/当通信状态变化oAjax.abort() 使中止oAjax.readyState 是否完成/加载状态oAjax.status 是否成功response 回答/响应oAjax.responseText 返回结果JSON.parse() 可以把字符串json变成json 不过json要正规些 双引号JSON.stringify() json打印出来的方法encode 编码decode 解码Component 组件/元件encodeURIComponent(中文) 中文转化成编码decodeURIComponent(编码) 编码转化成中文str.replace 替换new RegExp() 正则表达式str.search() 跟indexOf一样 在正则用str.match 匹配正则.test(你要校验的str) true 正确满足 false 不满足 用这个的时候一定配合行首和行尾转译\d 数字 [0-9]\w 数字、英文、下划线 [0-9a-z_]\s 空白字符 所有的空白字符.代表任意字符\D 非数字 [^0-9]\W 非数字、英文、下划线 [^0-9a-z_]\S 非空白字符\u4e00-\u9fa5 中文量词{n} n个{n,m} n-m个{n,} 最少n个,最多随便{0,m} 最少随便 最多m个{1,} 就是 若干个{0,} 任意个 可以没有?{0,1} 最少没有 最多1个\ 转译特殊字符| 或的意思i 忽略大小写g 全局匹配m 多行模式^ 行首 如果在方括号里面是除了$ 行尾jqhide 隐藏show 显示toggle 点击hover 移入fadeIn 淡入fadeOut 淡出animate 运动函数(move)slideDown 滑动从上往下出来slideUp 滑动从下往上隐藏eq(下标) 标签获取的下标li>ali下面的第一级a伪类选择器:li:last li最后一个li:first li第一个li:eq(2) 第三个liobj:even 偶数obj:odd 奇数obj:has("p/标签名") 里面包含‘p’这个标签的就会选取obj:contains("p/内容") 内容有得‘p’ 就都会选取event/自己起行参名字.pageXX轴坐标event/自己起行参名字.pageYY轴坐标offset().top物体绝对的位置 ->getPos()函数offset().left物体绝对的位置position().top 物体距定位父级距离 ->offsetTopposition().left 物体距定位父级距离document.scrollTop 和原生一样document.scrollLeft和原生一样.width/.height 物体本身的宽高innerHeight/Width物体内部的宽高 包括padding 不包括边框outerHeight/Width物体盒子模型宽高父级.append(子级) 在父级内的后部追加父级.prepend(子级) 在父级内的前面追加子级.appendTo(父级) 在父级后部追加子级.prependTo(父级) 在父级前部追加obj1.after(obj2) 把2放在1的后面obj1.before(obj2) 把2放在1的前面bind() 事件绑定unbind() 事件解绑live() 事件委托die() 解除事件委托**以上四种不推荐 因为原理还是昂 所以推荐onobj.on() 可以事件绑定/委托each 循环$.trim() 去除首尾空格extend() 延伸height()就是宽度innerHeight包括padding、不包括边框outerHeight盒子模型的offset().left->getPos()position().left->offsetLeft()scrollTop()-> scrollTopeve.pageX/Y坐标maxlength 表单元素最大长度 属性$.fn.函数名=function(){} 建立jq封装函数$.fn.extend({函数名1:function(){},函数名2:function(){},...})汉字:[0x4e00,0x9fa5](或十进制[19968,40869])数字:[0x30,0x39](或十进制[48, 57])小写字母:[0x61,0x7a](或十进制[97, 122])大写字母:[0x41,0x5a](或十进制[65, 90])parent() 父级offsetParent() 定位父级parents() 所有父级 括号里面可以筛选 比如放class名字或...str/arr.slice(开始位置,结束位置)切 从开始到结束 如果只有开始 就从开始到最后。 前包后不包prototype 原型form表单中 submit 提交 reset 重置xxx instanceOf xxx 检测一个对象属于某个类xxx.constructor==xxx 看构造函数 双等是判断 直接父级属不属于xxx 一个等号是赋值让直接父级等于xxxfn.call(this的指向,参数一,参数二,....) 改变this的指向 fn中的this=fn.apply(this的指向,[参数一,参数二,....]) 改变this的指向 fn中的this=init 开始localStorage 本地存储一般的规范localStorage.name=value存localStorage.name 取delete localStorage.name 删除一条localStorage.clear() 删除全部规范的存取localStorage.setItem(name,value)localStorage.getItem(name)localStorage.removeItem(name)sessionStorage 临时存储 和localStorage一样用法include() 包含template.defaults.openTag=; 自定义模板开始样子template.defaults.closeTag=; 自定义模板结束样子template.config(openTag,)template.config(closeTag,)template.config(escape,true/false) true不默认转译 false默认转译m model 模型v view 视图c controller 控制器scope 范围 作用域then 然后model模型bind绑定ng-app=""; 引用其他模块ng-model="" 数据从哪来ng-bind=""或 model 或 {{xxx}} 数据到哪去ng-init 初始化ng-repeat 循环angular.module(名字,[依赖模块).controller(名字,function(依赖项){})$scope$http$interval$timeout` 反单引号 包住字符串 拼接是这样 ${}|currency:"" 货币date:"" 时间戳转化处理route 路由/状态filter 过滤器directive 指令restrict 类型 E:element C:class M:comment A:attributeservice 依赖oDate.toString() 获取正常时间creator.ionic.io 做手机端的框架网站不错ng-show true false显示 隐藏ng-hide true false隐藏 显示ng-clackcomment 注释bundle 打包transclude 嵌入params 参数provider 提供者.config() 配置$scope.$watch(数据,fn)template 模板templateUrl:模板地址 模板$ bower install *** 下载东西用的ReactDOM.render(什么东西,渲染到哪)type=text/babelstate 状态extends 延伸 继承constructor 创建super 超类/父类component组件React.Componentthis.props.**属性组件中 ref和正常的ID类似vueel:iddata:{}$indexcapitalize 首字母大写uppercase 变大写字母lowercase 变小写字母ev.stoppropagation() 阻止冒泡ev.preventDefault()阻止默认事件**angularangular.bind(this的指向,要改变指向的函数名,参数)bootstrap 开启应用模式copy(复制谁,复制到哪里) 复制/克隆equals(a,b) 比较forEach 循环fromJson 字符串json转化成jsonextend(obj,obj1,obj2。。。) 扩展标签里面属性 transition="名字" 过渡 动画.名字-transition 过渡transition:时间 让谁变/all ease;enter 进来leave 出去route 路由/状态watch 监控props 存东西 可在替换模板身上用Router-view 状态视图v-link="{path:/***}"emulateJSON:true POST交互加上cmbcd.. 返回上一层文件夹名 进入下一层清屏 clearls查看当前文件夹中有什么文件touch 文件名 新建文件rm 文件名 删除vi 文件名 编辑文件cat 文件名 查看文件内容mkdir 创建文件夹rmkir 删除文件夹echo welcome/** > b.txt 创建文件并写入内容‘welcome’git init 初始化文件夹变git文件夹git status 查看当前git状态/工作状态init 初始git add .git commit -m sddadadadadgit pushnpm install grunt-cli -ggrunt.loadNpmTasks(grunt-contrib-cssmin); //括号传参插件名字grunt.initConfig({})expand:true,//是否分开压缩options:{ mangle:false}//不损坏grunt.registerTask(default,[cssmin]); //插件名字echarts 插件swiper 滚动的插件let 让const 不变的Array.from(arr) 复制数组map.entries()map.keys()map.values()import 进口/输入$a=12; php变量写法echo **;php输出<?php//code ?>php的写法result 结果varchar 字符(包含数字 字符串等)fetch 抓取mysql_connect(服务器名,账号,密码) 连接服务器mysql_select_db(自己建立的一个服务器名) 选择服务器SELECT * FROM user WHERE 服务器数据名=数据值编写sqlmysql_query(填写自己创建的sql名字) 执行抓取数据的sqlmysql_fetch_row(填写执行sql名字)抓取一个数据INSERT INTO user VALUES(数据名,数据名) 编写添加数据的sqlnode *.js 执行http.createServer() 创建一个服务器listen(端口号) 监听fs.readFile 读取文件的Buffer 二进制流from (表示时间)从…; (表示原因)因为; (表示来源)来自…; (表示分离)与…分离[隔开];form形状,形式; 外形; 方式; 表格;when 当\b单词边界onpasteoncopy当输入的时候h5 标签aside 侧边栏article 文章number 数字输入框minmaxstep 控制number每次增加的数值url 网址tel 电话color 颜色 拾色器range 范围/拖动条date 选择日期week 选择周month 月份datetime-localmeter 类似进度条video 视频controls 默认显示播放等操作控件autoplay 自动播放loop 一直播放(播放完了会重新播放循环)poster 封面source 放格式的/资源obj.play() 播放obj.pause() 暂停obj.muted 静音obj.volume 音量obj.currentTime 快进快退obj.webkitRequestFullScreen() 全屏obj.paused 暂停(数值:true/false)obj.currentTime 视频进度时间obj.duration 视频总时间obj.currentTime/obj.duration100+% 进度条obj.paused 值:true/falseaudiocontrols 默认显示播放等操作控件autoplay 自动播放loop 一直播放(播放完了会重新播放循环)canvas 绘图标签 游戏类的绘图画图之类webwoker 多线程js是单线程websocketwebsql 数据库querySelector 一个querySelectorAll 一组classList.add() 追加classList.remove() 删除classList.contains() 查看有没有这个classclassList.toggle(*) 有就让没有,没有就让有ontimeupdate 当时间改变的时候onended 当结束时候dataset 一种新的设置自定义属性的方法 --其实性能不如attributeobj.dataset[*****]= 可以设置也可以获取 data-等自动义属性的一个集合 jsonconsole.time()//code-> 可以测试中间的代码执行耗时console.timeEnd(**)obj.onstorage 当存储的时候transparent 透明色/继承父级的颜色radius 半径border-radius 圆角css hack_ ie6识别box-shadow 阴影:x偏移量(px) y偏移量(px) 模糊程度blur(px) colorbackground: 渐变(-webkit-(是判断浏览器内核,可以省略))-webkit 谷歌-moz火狐-ms ielinear 线性渐变:-webkit-linear-gradient (0deg(方向), color1 25%(渐变开始位置), color2 75%(渐变开始位置))radial 径向渐变:-webkit-radial-gradient (left/px top/px, circle(圆形)/ellipse(椭圆), color1 **px,color2 **px)repeating 秋裤效果/重复创建:-webkit-repeating-radial-gradient (red **px, yellow px,..)linear 线性radial 径向repeating 重复的gradient 梯度circle圆形ellipse 椭圆-webkit-mask 遮罩层/蒙版-webkit-mask-position 遮罩层/蒙版定位-webkit-box-reflect 倒影-webkit-filter:blur(5px)/模糊程度数值;模糊:方向距离/px渐变-webkit-linear-gradient()below 下面contenteditable=true/false让标签可以输入内容@keyframes test//名字animation:8s test/名字linear infinite/数值/次数;background-size 背景尺寸contain 以最合适的状态展示 可能会留白cover 尽可能填满nth-child(下标 注意:从1开始)注意:项目不用这个。禁用nth-of-type(下标 注意:从1开始) 注意:项目不用这个。禁用background-origin:背景从哪里开始content-boxborder-boxpadding-boxbackground-clip:背景从哪里开切content-boxborder-boxpadding-boxtext 注意:这个background-clip前面要加上webkit-

 

内容看完了

“Web前端开发常用词汇” 的相关文章

(PC+WAP)微信小程序开发代理展示销售pbootcm网站模板 软件开发公司网站源码下载

(PC+WAP)微信小程序开发代理展示销售pbootcm网站模板 软件开发公司网站源码下载

pbootcms内核开发的网站模板,该模板适用于微信小程序网站、软件开发网站等企业,当然其他行业也可以做,只需要把文字图片换成其他行业的即可;PC+WAP,同一个后台,数据即时同步,简单适用!附带测试数据!友好的seo,所有页面均都能完全自定义标题/关键词/描述,PHP程序,安全、稳定、快速;用低成…

(PC+WAP)红色火锅加盟网站pbootcm模板 餐饮美食网站源码下载

(PC+WAP)红色火锅加盟网站pbootcm模板 餐饮美食网站源码下载

(PC+WAP)红色火锅加盟网站pbootcms模板 餐饮美食网站源码下载pbootcms内核开发的网站模板,该模板适用于火锅加盟网站、餐饮美食网站等企业,当然其他行业也可以做,只需要把文字图片换成其他行业的即可;PC+WAP,同一个后台,数据即时同步,简单适用!附带测试数据!友好的seo,所有页面…

(PC+WAP)绿色草坪地坪施工pbootcm网站模板 操场人造草坪网站源码下载

(PC+WAP)绿色草坪地坪施工pbootcm网站模板 操场人造草坪网站源码下载

(PC+WAP)绿色草坪地坪施工pbootcms网站模板 操场人造草坪网站源码下载pbootcms内核开发的网站模板,该模板适用于人造草坪网站、草坪地坪网站等企业,当然其他行业也可以做,只需要把文字图片换成其他行业的即可;PC+WAP,同一个后台,数据即时同步,简单适用!附带测试数据!友好的seo,…

(自适应手机版)响应式统一战线政府单位机构类网站源码 红色政府部门机构网站模板

(自适应手机版)响应式统一战线政府单位机构类网站源码 红色政府部门机构网站模板

本套织梦模板采用织梦最新内核开发的模板,这款模板使用范围广,不仅仅局限于一类型的企业,政府部门、单位机构类的网站都可以用该模板。你只需要把图片和文章内容换成你的即可,颜色都可以修改,改完让你耳目一新的感觉!布局规整,利于用户体验,手工书写DIV+CSS,代码精简。同一个后台管理 三网合一简…

0间隔24h采集线报+源码的资源网

0间隔24h采集线报+源码的资源网

1.更新下载类目的采集 及 导入网站程序:jizhiCMS + 高仿新版某刀资源网模板采集程序:蓝天采集 + 已对接好资源站规则网站图片及蓝天采集规则安装教程在下面⬇⬇⬇⬇⬇⬇⬇         链接:https:/…

100多套官网HTML源码 前端静态页面源码

100多套官网HTML源码 前端静态页面源码

简介:104套官网源码静态html页面APP下载页面HTML源码,多年收藏精品HTML官网源码104套所有行业均可修改使用。人工精选源码每一套都是精品,纯静态页面无后台下载连接(复制直接下载)https://wp.123vo.cn/index/share/code/jq2ENvLPb1内容看完了…