js基本知识3
1. 函数 function
函数的声明 函数的 调用 函数的传参
2. 函数返回值
Return 返回结果 返回给函数
Id 函数
function $id(id) { return document.getElementById(id);}
3. 获得焦点 onfocus onblur 失去焦点
4. this 这个 自己的 指向的是 事件调用者
5. InnerHTML 属于盒子的内容 表单的内容 value
6. 表单自动获得焦点 focus() 选择表单内容 select();
7. For(var i = 0; i<;i++) { } 遍历
8. For(;;){ } 死循环
9. GetElementById() id元素 一个
10. getElementsByTagName() 很多个
1.2 判断用户输入事件
正常浏览器 : oninput
Ie 678 支持的 : onpropertychange
1.3 数组 array
数组是做什么用的?
var num = 10; 变量可以用来存储东西 。
一个变量里面只能一个值。
我们130人,想把我们每个人的人名存储,要用变量需要 130变量。
这个时候可以考虑 数组 。 组合
数组: 就是一个大变量, 它里面可以存储很多的值。
1.3.1 声明数组
var arr = [1,3,5,7,9];
var arr = new Array(1,3,5);
1.3.2 使用数组
使用的方法: 数组名[索引值]; 函数名();
索引号是从0开始的。 0 1 2 3 4 5 ...
var textArr = ["刘备","诸葛亮","赵云","关羽"];
console.log(textArr[3])
1.3.3 数组的长度
数组名.length;
1.3.4 遍历数组
想到了for 遍历 数组
getElementsByTagName() 得到一个伪数组
1.3.5 案例 隔行变色
<script>
window.onload = function(){
var lis = document.getElementsByTagName("li"); // 得到所有的li
//alert(lis.length);
for(var i = 0; i<lis.length; i++)
{
if(i%2 == 0) // 只有偶数能被2整除
{
lis[i].style.backgroundColor = "#eee";
}
//鼠标经过li 的时候, 当前的底色变亮
lis[i].onmouseover = function(){
this.className = "current";
}
lis[i].onmouseout = function(){
this.className = "";
}
}
}
</script>
1.3.6 求平均值
<script>
var arr = [10,20,30,34,67];
function avg(array){ // 封装求平均值函数
var len = array.length; // 数组的长度
var sum = 0;
for(var i=0; i<len; i++)
{
sum += array[i]; // sum = sum +array[i];
}
return sum / len;
}
//a*=3 a= a*3
console.log(avg(arr));
</script>
字符相连
+
数值相加 字符相连
1+1 = 2;
“你好” + “吗” “你好吗”
“你好” + 2 “你好2” “0” + 10 “010”
10 - “2” 8
所有的input 取过来的值 是 字符型。
三元运算符 三目运算符
一元: a++ b++ +a -a
二元: a+b a>=b
三元: 表达式 ? 结果1 : 结果2 等价于 if else
如果表达式结果为真 , 则返回 结果1
如果表达式结果为假, 则返回结果2
if(3>5) {alert(“11”)} else { alert(22)} ==
3>5 ? alert(11) : alert(22)
the king is always luck
王老吉
1.4 排他思想
排他思想:
首先干掉所有人, 剩下我自己
<script>
window.onload = function(){
var btns = document.getElementsByTagName("button");
for(var i=0;i<btns.length;i++)
{
btns[i].onclick = function(){
//清除所有人的 类名 只能用 for 遍历
for(var j=0;j<btns.length;j++)
{
btns[j].className = "";
}
//就剩下自己 就是一个 而且是点击那个
this.className = "damao";
}
}
}
</script>
1.5 变量 和属性
变量
是独立存在的 自由自在的
miss 小姐 女士
属性和方法
属于某个对象的 属性和 方法
mrs
var index = 10; //变量 谁都可以使用
var arr = []; // 数组
arr.index = 20; // 自定义属性 他只能在arr 才能使用
alert(arr.index);
js基本知识3的更多相关文章
- [JS复习] JS 基础知识
项目结尾,空闲时间,又把<JS 基础知识> 这本书过了一遍,温故知新后,很多知其然不知其所以然的内容 豁然开朗. [1. 用于范围的标签] display :inline or bloc ...
- HTML+CSS+JS基础知识
HTML+CSS+JS基础知识 目录 对HTML+CSS+JS的理解 基础知识 对HTML+CSS+JS的理解 基础知识 插入样式表的三种方式 外部样式表:<link rel="sty ...
- Node.js基础知识
Node.js入门 Node.js Node.js是一套用来编写高性能网络服务器的JavaScript工具包,一系列的变化由此开始.比较独特的是,Node.js会假设在POSIX环境下运行 ...
- 网站开发进阶(十五)JS基础知识充电站
JS基础知识充电站 1.javascript alert弹出对话框时确定和取消两个按钮返回值? 用的不是alert对话框,是confirm confirm(str); 参数str:你要说的话或问题: ...
- NodeJs>------->>第三章:Node.js基础知识
第三章:Node.js基础知识 一:Node.js中的控制台 1:console.log.console.info 方法 console.log(" node app1.js 1> ...
- JS底层知识理解之执行上下文篇
JS底层知识理解之执行上下文篇 一.什么是执行上下文(Execution Context) 执行上下文可以理解为当前代码的执行环境,它会形成一个作用域. 二.JavaScript引擎会以什么方式去处理 ...
- 零散的JS和node.js小知识
JS的连续赋值和曾经出现的怪异情况 let a=1; let b=a=3; 如上的真实赋值过程 => a=1 => a=3 => b=3 => 一般来说,等号是从右向左赋值的 ...
- 前端学习:JS面向对象知识学习(图解)
前端学习:JS面向对象知识学习(图解) 前端学习:JS(面向对象)代码笔记 JS面向对象图解知识全览 创建类和对象 方式1:使用Object()函数 方式2:使用自变量 方式3:使用工厂函数 创建多个 ...
- JS基础知识二
JS控制语句 switch 语句用于基于不同的条件来执行不同的动作 <script> function myFunction(){ var x; var d=new Date().getD ...
- JS基础知识笔记
2020-04-15 JS基础知识笔记 // new Boolean()传入的值与if判断一样 var test=new Boolean(); console.log(test); // false ...
随机推荐
- OpenCV中图像融合
准备2副背景图像,注意图像黑色的部分,是作为mask用的,我们会用灰度图的方式打开它们,这时黑色的部分值为0,则图像融合时候,可以把第二幅图像在黑色的部分显示出来. 代码非常简单,注意就是图 ...
- Android触控屏幕Gesture(GestureDetector和SimpleOnGestureListener的使用教程) 分类:Androidandroid实例
1.当用户触摸屏幕的时候,会产生许多手势,例如down,up,scroll,filing等等,我们知道View类有个View.OnTouchListener内部接口,通过重写他的onTouch(Vie ...
- java中的深浅克隆
假设有一个对象object,在某处又需要一个跟object一样的实例object2,强调的是object和object2是两个独立的实例,只是在开始的时候,他们是具有相同状态的(属性字段的值都相同). ...
- 设计模式(一)简单工厂(创建型)(Java&&PHP)
面向对象设计的基本原则 单一职责系统中的每一个对象应该只有一个单独的职责,所有对象关注的应该是自身职责的完成. 基本思想:高内聚,低耦合. 开闭原则一个对象对扩展开放,对修改关闭.基本思想:对类的改动 ...
- 利用MyEclipse开发一个调用webservice接口的程序
上一篇文章我们已经学习了如何使用Java 工具MyEclipse开发一个webservice接口,那么接口开发好了如何调用?接下来我们就来解决这个问题. 1:首先随便创建一个Java project选 ...
- 使用 FOR XML PATH 產生 XML 格式時,遇到 NULL 該如何處理?
當您嘗試利用 FOR XML PATH 產生 XML 格式時,若遇到 Result Set 為 Null 時,會導致整個查詢結果為 Null ,若您想要在查不到資料時,可以顯示自訂的內容,本文將提供可 ...
- 《Go并发编程实战》第2版 紧跟Go的1.8版本号
文章作者:郝林(<Go并发编程实战 (第2版)>作者) 最终来了! 经过出版社的各位编辑.校对.排版伙伴与我的N轮PK和共同努力,<Go并发编程实战>第2版的全部内容最终全然确 ...
- kCGImagePropertyExifDictionary 引用错误
kCGImagePropertyExifDictionary 引用错误 使用 AVFoundation拍照 //获取图片 [outputImage captureStillImageAsynchron ...
- 利用html5调用本地摄像头拍照上传图片[转]
利用html5调用本地摄像头拍照上传图片 html5概念啥的就不废话了,不知道的 百度, 谷歌一堆..今天学了学html5中的Canvas结合新增的<video>标签来获取本地摄像头, ...
- 【转】使用python进行多线程编程
1. python对多线程的支持 1)虚拟机层面 Python虚拟机使用GIL(Global Interpreter Lock,全局解释器锁)来互斥线程对共享资源的访问,暂时无法利用多处理器的优势.使 ...