html、css和js学习笔记
晨读关键词1小时
html+css常见单词
布局常用单词
layout 页面布局
header 头部/页眉；
index 首页/索引；
logo 标志；
nav
banner 横幅广告；
main/content 主体/内容；
container/con 容器；
wrapper/wrap 包裹（类似于container）；
menu 菜单；
sub_menu/second_menu 子菜单/二级菜单；
list 列表；
float 浮动；
clear 清除；
section 分区/分块（类似于div）;
article 文章；
aside 侧边栏/广告；
footer 页脚/底部；
title/sub_title 标题/副标题；
msg/info 信息（message）/消息；
ads 广告（advertisements）;
tel 联系电话（telephone）；
address 地址；
& nbsp; 空格（&和n之间的空格去掉,不要忘记分号）;
CSS样式（style） CSS 层叠样式表 (Cascading Style Sheets) ；
background: -webkit-gradient(top red orange yellow green lightblue blue purple) 颜色渐变；
position 定位；
relative/absolute/fixed 相对定位/绝对定位/固定定位；
vertical-align: middle/top/bottom;
copyright 版权；
contact_us 联系我们；
friend_link 友情链接；
盒子常用单词
line-height 行高；
margin 外边距；
padding 内边距；
solid/dashed/dotted 实线/线虚线/点虚线；
border-radius 圆角；
shadow 阴影；
block/inline-block 块元素/行内块；
overflow 溢出；
cursor 光标；
cursor:pointer; 鼠标移上变为小手；
animation 动画；
css sprites 图片精灵；
column 分列；
flex 弹性（布局）；
表单（form）和表格（table）
action 行为；
method 方式/方法；
checkbox 复选框；
submit/reset 提交/重置；
select/option 选择框/选择项；
placeholder 占位符（起提示作用）；
autofocus 自动聚焦；
disabled 禁用；
checked 选中（单选框/复选框）；
selected 默认选择项（下拉选择框）；
required 必填项；
readonly 只读；
thead/tbody/tfoot 表格标题/主体/底部；
colspan 跨列；
rowspan 跨行；
cellspacing 单元格间距（类似于margin）；
cellpadding 单元格边距（类似于padding）；
border-collapse: collapse; 边框合并（用于table上）；
js常见单词
获取元素对象:
getElementByld：
getElementsByName：
gatElementsByTagName：
getElementByClassName：
常见数学元素:
push :添加元素
pop ：删除元素
shift ：删除第一个数组元素
Concat 组合数组
undefined ：未定义
typeof ：关键字
join：数组转化为指定分隔符
slice：返回指定数组
Array：数组
number：数字
boolean：布尔
alert：提示框
parseInt：转化为整型数值
continue：继续
is NaN：非数字
sort：升序
break：截断 跳出
reverse：倒序
object：对象类型
parseFloat：转化为浮点值
floor：向下取整
variable：变量
ceil：向上取整
round:四舍五入
abs：返回绝对值
eval：解析字符串并运算
addEventListener：事件名 函数
to.fixed：保留小数点
attachEvant：（on）事件名
random：随机数
element：元素
open（）：弹出一个新窗口
function：函数（方法）
showModalDialog：弹出一个模式窗口
close（）：关闭当前窗口
表示时间的关键词
Date：日期对象
getFullYear（）：年份
getMonth（）：月份（0–11）
getDate（）：几号
getDay（）：星期几（周一至周六）
getHours（）：小时（0–23）
getMinutes（）：分钟
getSeconds（）：秒数（0–59）
getMilliseconds（）：毫秒数
getTime（）：从1970至今的毫秒数
Date.now（）：从1970至今的毫秒值
tolocaleDatestring（）：输出本地化的日期
setTimeout：延迟时间
tolocaleTimestring（）：输出本地化得时间
clearTimeout：清除定时器对象
tolocalestring：输出本地化的日期和时间
setInterval：设置定时器
clearInterval：清除定时器
表示window属性的关键词
window.status：浏览器状态栏信息
window.screen：屏幕信息
screen.width：屏幕宽度
screen.height：屏幕高度
screen.availwidth：去掉任务栏宽度
screen.avaiheight：去掉任务栏高度
表示浏览器关键词
history：浏览历史记录
location：地址栏对象
navigator：用于获取用户浏览器信息
appCodeName：浏览器代码名的字符串表示
appName：返回浏览器的名称
appVersion：返回浏览器的平台和版本信息
platform：返回运行浏览器的操作系统平台
userAgent：返回由客户机发送服务器的
user-agent：头部的值
Exception：异常 意外情况（try—catch）
键盘点击事件
onchange;内容改变事件
onkeydown;键盘按下事件（前）
onkeyup;键盘松开事件
onkeypress;键盘按下事件（后）
onload：当页面加载完成之后触发
鼠标点击事件
onfocus：获得焦点事件
onblur：失去焦点事件
onclick：鼠标单击事件
eventName：事件名
ondblclick：鼠标双击事件
function：函数
onselect：内容被选中事件
removeEventListener：事件解除
onmouseover：鼠标移入事件
detachEvent：删除已注册事件
onmouseout：鼠标移出事件
学习方法
勤敲代码(键盘敲烂,月薪过万)
先把代码敲熟,
再用自己的理解去默写出来
能不能推敲出几种实现思路
勤练打字、端正指法
上班之前10分钟
吃饭之前10分钟
下班之前10分钟
学习态度
打破砂锅问到底
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>学习秘籍</title>
</head>
<body>
<h3>这是我第一天深入学习html、css、js</h3>
<button type="button" onclick="study()">学习秘籍</button>
<script>
function study(){
var res = prompt("你是否确定学习前端开发？")
if(res == "是"){
alert("你已获得了搬砖的秘籍");
}
else{
alert("输入有误");
}
}
</script>
</body>
</html>
5710
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
