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 ...
随机推荐
- iOS:CoreData数据库的使用二(创建多个数据库表,表之间有对应关系)
CoreData数据库框架是一个封装性好,功能强大数据库,它底层使用的还是sqlite数据库,不过苹果公司在其基础上,为其封装新和安全性的维护上做了大量的处理,例如对一些事物做了详细的操作,如读脏数据 ...
- java如何判断编码是否是utf8编码
String的getBytes()方法是得到一个系统默认的编码格式的字节数组getBytes("utf-8") 得到一个UTF-8格式的字节数组 把String转换成bytes, ...
- IE系列不支持圆角等CSS3属性的解决方案
IE系列浏览器不支持CSS的圆角(border-radius)等CSS3属性是一个众所周知的问题,而FF.Chrome原生的浏览器支持是的优雅的圆角感觉较好,如何解决这个问题呢? 一种比较传统的方案是 ...
- 用asp.net还原与恢复sqlserver数据库
上次做了个项目,涉及到数据库的还原和恢复,到网上找了一下,是利用SQLDMO实现的,只要添加SQLDMO引用就好了,然后利用下边的类的方法就可以实现了. 我把原作者的类扩充了一下,可以自动识别web. ...
- Thinkphp学习笔记-模板主题
一个模块如果需要支持多套模板文件的话,就可以使用模板主题功能. 默认情况下,没有开启模板主题功能,如果需要开启,设置 DEFAULT_THEME 参数即可: // 设置默认的模板主题 'DEFAULT ...
- token 机制
- [Functional Programming] Unbox types with foldMap
Previously we have seen how to use Concat with reduce: ), Sum(), Sum()] .reduce((acc, x) => acc.c ...
- JQuery EasyUI 动态改变表单项的验证守则
//JQuery EasyUI 动态改变表单项的验证规则 $(document).ready(function(){ $('#FILE_QUALITY').combobox({ onChange:fu ...
- Java网络爬虫 - 一个简单的爬虫例子
WikiScraper.java package master.haku.scrape; import org.jsoup.Jsoup; import org.jsoup.nodes.Document ...
- gem 更新源设置,ruby安装
gem sources --remove http://rubygems.org/ gem sources -a http://ruby.taobao.org/ gem sources -l 结果只有 ...