学习日志

Posted 2020-10-18 xiaomianyangken

 

学习日志

         集中时间把课堂的基础课程看完，并且认真完成了课后练习。感觉在JS方面的技能算是入了个门了，项目也比以前了解了许多。课后练习的作业完成的代码我都汇总在了这里，则记录如下。

第01 天 2017/12/18  

一、知识点及原理:(JS入门基础_课程)

1》写JS的步骤

 

1. 先实现布局
2. 想出实现原理
3. 了解JS语法

2》希望把某个元素移除的实现

• display: none; 显示为无
• visibility: hidden; 隐藏
• width \ height
• 透明度
• left \ top
• 拿与背景色相同的div盖住该元素
• 利用margin值
• ……

3》获取元素

• getElementById() ——静态方法，前面只能跟document
• document.body、document.title 页面中只有一个的元素
• getElementsByTagName() ——动态方法，前面可以跟document也可以跟其他元素，返回的是一个类似数组的元素的集合
  • 有类似数组的length
  • 有类似数组的应用方式，比如ali[0]
  • 在用TagName的时候，必须要加上中括号[]
  • 所谓的动态方法，是指通过js动态添加的元素，getElementsByTagName()也可以找到，但是document.getElementById是找不到的

4》事件

事件：鼠标事件、键盘事件、系统事件、表单事件、自定义事件

• onclick
• onmouseover
• onmousedown
• onmouseout
• onmouseup
• onmousemove
• ……

如何添加事件

• 元素.onmouseover

5》函数

函数可以理解为命令，做一些事情，如:

function abc() { //肯定不会主动执行！ … }

1. 直接调用：abc();
2. 事件调用：元素.事件 = 函数名 (oDiv.onclick = abc;)
3. ……

function(){} 匿名函数

元素.事件 = function(){}

测试

• alert(1); 带确定按钮的警告框；alert(‘ok’); ‘ok’ 字符串
• 初学者：最好保持随时写，随时测试的习惯

变量

var li = document.getElementById(‘lis’);

var num = 123;

var name = ‘leo’;