说在前面：为什么没有 HTML 的学习记录？HTML 的标签看这个就好的啦
HTML 定义网页内容
CSS 规定网页的布局
JS 对网页行为进行编程
getElementById() 根据元素的 id 对它进行操作
.innerHTML 元素内容
.src 元素属性
.style 元素样式
.style.display 可显示或隐藏元素
<!DOCTYPE html> <html> <body> <h3>改变 HTML 内容</h3> <p id = "demo1">DEMO</p> <button type = "button" onclick = 'document.getElementById("demo1").innerHTML = "DEMOOO"'>CLICK</button> <hr /> <h3>改变 HTML 元素样式</h3> <p id = "demo2">DEMO</p> <button type = "button" onclick = "document.getElementById('demo2').style.color = '#A2DA65' "> CLICK </button> <hr /> <h3>隐藏/显示 HTML 元素</h3> <p id = "demo3">DEMO</p> <button type = "button" onclick = "document.getElementById('demo3').style.display = 'none' ">隐藏</button> <button type = "button" onclick = "document.getElementById('demo3').style.display = 'block' ">显示</button> </body> </html>
JS 可以不同的方式显示数据
window.alert() 警告框
document.write() 写入 HTML 输出
innerHTML 写入 HTML 元素
console.log() 打印在浏览器控制台
JS 关键词
break 跳出 switch 或循环
continue 跳出循环从顶部开始
debugger 停止 JS 并调用调试语句
do...while 执行语句块 在条件为 true 时重复代码块
for 标记被执行的语句块
function 声明函数
if...else 条件判断
return 返回
switch 标记被执行的语句块
try...catch 捕捉异常
var 声明变量 （声明变量的时候不可以用连字符） var demo; 这个时候 demo 的值是 undefined
JS 数据类型
数字 var num = 1;
字符串 var s = "string";
数组 var a = ["zlr", "zufe"];
对象 var animal = {name : "cat", sound : "miaomiaomiao"};
var person = {
firstName : Tom,
lastName : Green,
age : 23,
fullName : function () {
return this.firstName + " " + this.lastName;
}
};
JS 事件
onchange HTML 元素已经改变
onclick 点击 HTML 元素
onmouseover 鼠标移动到 HTML 元素上
onmouseout 鼠标移出 HTML 元素
onkeydown 按下键盘按键
onload 页面完成加载
JS 字符串方法
length 字符串长度
indexOf() 字符串中指定文本首次出现的位置 如果没有返回 -1
lastIndexOf() 字符串中指定文本首次出现的位置 如果没有返回 -1
search() 方法搜索特定值的字符串，并返回匹配的位置
提取字符串（如果 st en 是负数的话代表从结尾开始计算）
slice(st, en)
substring(st, en)
substr(st, len)
replace(a, b) b 替换 a 只能替换首个匹配
toUpperCase() 字符串转大写
toLowerCase() 字符串转小写
concat() 连接两个字符串 s1.concat(s, s2); s1 和 s2 用 s 连起来
trim() 删除两端空格
split("c") 字符串转数组 中间用 c 分割
JS 数值方法
toString() 以字符串返回数值
toExponential() 返回字符串值 它包含已被四舍五入并使用指数计数法的数字
toFixed() 返回字符串值 它包含了指定位数小数的数字
toPrecision() 返回字符串值 它包含了指定长度的数字
valueOf() 返回数值
变量转化为数字
Number() 返回数字 由其参数转换而来
parseInt() 解析其参数并返回浮点数
parseFloat() 解析其参数并返回整数
MAX_VALUE
MIN_VALUE
NEGATIVE_INFINITY 负的无穷大（溢出返回）
NaN 表示非数字的值 "Not-a-Number"
POSITIVE_INFINITY 无穷大（溢出返回）
JS 数组方法
toString() 把数组转化成数组值的字符串 逗号分隔
join(c) 数组元素结合成一个字符串 用 c 连接
pop() 从数组后面删除最后一个元素
push() 在数组结尾添加一个元素
shift() 删除第一个元素然后其他元素左移 返回被移出的字符串
unshift() 在头添加新元素 返回新数组长度
splice(pos, num, s1, s2,...,snum) 在数组里添加新的项 （num 代表要被删除的项）
sort() 排序
reverse() 反转
foreach() 遍历
<!DOCTYPE html> <html> <body> <p>为每个元素调用一次函数。</p> <p id="demo"></p> <script> var txt = ""; var numbers = [45, 4, 9, 16, 25]; numbers.forEach(myFunction); document.getElementById("demo").innerHTML = txt; function myFunction(value, index, array) { txt = txt + value + "<br>"; } </script> </body> </html>
map() 映射
map() 不会改变原数组的值
map() 不会对没有值的数组元素执行
map() 通过对每个数组元素执行函数来创建新数组
<!DOCTYPE html> <html> <body> <p>通过对每个数组元素执行函数来创建新数组。</p> <p id="demo"></p> <script> var numbers1 = [45, 4, 9, 16, 25]; var numbers2 = numbers1.map(myFunction); document.getElementById("demo").innerHTML = numbers2; function myFunction(value, index, array) { return value * 2; } </script> </body> </html>
filter() 过滤器
reduce()
reduceRight()
every() 检查所有数组值是否通过测试
some() 检查某些值是否通过测试
indexOf() 从头搜索元素值并返回位置
lastIndexOf() 从尾搜索元素值并返回位置
find() 返回通过测试函数第一个数组元素的值
find() 返回通过测试函数第一个数组元素的值的位置
JS == 和 === 的区别
== 只判断值 不判断类型
=== 必须值和类型都相等
console.log(123 == "123") --->true
console.log(123 === "123") ---> false
JS 函数 emmmm 单独写一篇博客记吧