js笔记6
1、函数都有返回值,人为return,返回什么就是什么,否则,他的返回值就是undefined
而方法的本质也是函数,所以也有返回值
document.getElementById()返回的是获取的标签
document.getElementsClassName()返回的是一个数组集合
document.getElementsTagName()返回的是一个数组集合
选中一个元素修改他的内容 (上边三个)
document.getElementsByClassName("name")[0].innerHTML="hahahh";这句话的意思
是选中一个所有用class起一个名字的元素数组,并选中数组中的第一个叫做这个名字的标签,给它
修改内容为hahahh。
2、改变标签的属性 元素.属性名
var pic=document.getElementsByTagName("img");
pic[0].src="路径src.jpg''
3、修改和添加css样式 元素.style.width(css属性名)="属性值";
var pic=documentByTagName("img");
pic[0].style.width="500px";
4、事件:用户在事件中所触发的行为
(1)点击 onclik
(2)鼠标进入 onmouseenter 鼠标离开onmouseleave
(3)鼠标移动 onmousemove
(4)鼠标悬浮 onmouseover 鼠标移除 onmouseout
(5)鼠标按下 onmousedown 鼠标抬起 onmouseup
(6)表单聚焦 onfocus 表单失去焦点 onblur
表单内容修改 onchange
(7)浏览器加载完成 onload
这些事件使用时必须跟一个函数配合使用
1)事件 将事件当做标签属性使用 <img src="xx.jpg" onclik="alert(123)"/>
2)通过事件绑定,将事件当成一个元素的属性
特例:对于class,html中的class在js中是关键字,获取class这个属性时必须使用clssName来获取或修改
pic[0].onlick=function(){
pic[0].className="pic"
}
5、JS中的for循环没有关系都是互相独立的
*解决10.24案例中的i和for匹配的问题
方法一:给事件套用一个自调用函数
for( var i=0;i<arr.length;i++){
(function(i){
lis[i].onlick=function(){
tupian.src=arr[i]
}
})
}
方法二:人为定义属性,将索引存在属性里,需要的时候调用属性(this)
for( var i=0,i<arr.length,i++){
人为定义一个属性,来存储for循环的i
lis[i].index=i;
lis[i].onlick=function(){
tupian.src=[this.index]
}
}
*this
this是js的一个关键字,它是一个对象,一般用在函数里用于指向函数内部的关系
div.onlick=function(){this}
如果函数在定义的时候前面有,那么this就指向点前面的对象,如果函数定义的时候没有对象,那么this就是window
js笔记6的更多相关文章
- Data Visualization and D3.js 笔记(1)
课程地址: https://classroom.udacity.com/courses/ud507 什么是数据可视化? 高效传达一个故事/概念,探索数据的pattern 通过颜色.尺寸.形式在视觉上表 ...
- js笔记-0
#js笔记-0 数组: indexOf方法: Array也可以通过indexOf()来搜索一个指定的元素的位置: var arr = [10, 20, '30', 'xyz']; arr.indexO ...
- PPK谈JS笔记第一弹
以下内容是读书笔记,再一次温习JS好书:PPK谈JS window.load=initializePageaddEventSimple('window','load',function(){}) lo ...
- 面向小白的JS笔记 - #Codecademy#学习笔记
前言 最初浏览过<JavaScript秘密花园>,前一段时间读过一点点<JavaScript语言精粹>和一点点<JavaScript高级程序设计>(一点点是指都只是 ...
- require.js笔记
笔记参考来源:阮一峰 http://www.ruanyifeng.com/blog/2012/10/javascript_module.html 1. 浏览器端的模块只能采用“异步加载”方式 = ...
- JS笔记 入门第四
小测试: 注意:取消所有的设定可以直接使用 document.getElementById("txt").removeAttribute("style"); 这 ...
- JS笔记 入门第二
输出内容 document.write(); alert("hello!"); alert(mynum); </script> 注:alert弹出消息对话框(包含一个确 ...
- Node.js笔记1
Node.js入门笔记 1. node -help 可以显示帮助信息2. node REPL 模式(Read-eval-print loop) 输入—求值—输出循环 直接在cmd输入node 可以进入 ...
- JS笔记 入门第一
WHY? 一.你知道,为什么JavaScript非常值得我们学习吗? 1. 所有主流浏览器都支持JavaScript. 2. 目前,全世界大部分网页都使用JavaScript. 3. 它可以让网页呈现 ...
- 奇舞js笔记——第0课——如何写好原生js代码
摘要 1.好的代码职责要清晰,javscript不要用来操作样式: 2.API要设计的合理:通用性,适度的抽象(数据抽象,过程抽象),可扩展性: 3.效率问题:用好的.合适的算法(前端程序员要把自己当 ...
随机推荐
- for 循环语句 (enumerate枚举,据说直接写出索引值)
for i in ***: 今天上课看到alex用了 for index,i in enumerate(list): print(index,i) (enumerate好像可以设置开头序号enumer ...
- [刷题] 416 Partition Equal Subset Sum
要求 非空数组的所有数字都是正整数,是否可以将这个数组的元素分成两部分,使得每部分的数字和相等 最多200个数字,每个数字最大为100 示例 [1,5,11,5],返回 true [1,2,3,5], ...
- Linux_rpm包管理
一.rpm包命令规范 1.包的组成 主包:bind-9.7.1-1.el5.i586.rpm 子包:bind-libs-9.7.1-1.el5.i586.rpm bind-utils-9.7.1-1. ...
- 自用Chrome插件推荐【附教程及下载】
自用Chrome插件推荐[附教程及下载] 豆子 1,675 人赞同了该文章 2019.11.03更新 原文同步发布在我的个人博客 Chrome插件自用blog.douzi.work 都是我自己一 ...
- 韩小韩 API接口
官方网址:https://api.vvhan.com/ 天气API接口: https://api.vvhan.com/api/weather Bing每日图片API接口: https://api.vv ...
- nmap扫描端口导致线上大量Java服务FullGC甚至OOM
nmap扫描端口导致线上大量Java服务FullGC甚至OOM 最近公司遇到了一次诡异的线上FullGC保障,多个服务几乎所有的实例集中报FullGC,个别实例甚至出现了OOM,直接被docker杀掉 ...
- Azure DevOps(二)利用Azure DevOps Pipeline 构建基础设施资源
一,引言 上一篇文章记录了利用 Azure DevOps 跨云进行构建 Docker images,并且将构建好的 Docker Images 推送到 AWS 的 ECR 中.今天我们继续讲解 Azu ...
- Go slice 扩容机制分析
前言 我们都知道 Go 语言中的 slice 具有动态扩容的机制(不知道的同学请先补课 Go 切片) 但是其底层机制是什么呢?本着知其然,知其所以然的探索精神去研究一番.还不是为了应试 手动狗头 go ...
- RADAR毫米波雷达传感器
RADAR毫米波雷达传感器 TI 利用先进的集成式射频 CMOS 雷达技术提供品类齐全的 60GHz 和 77GHz 传感器产品系列 通过高性能集成射频互补金属氧化物半导体 (CMOS) 雷达技术,可 ...
- 语义分割:基于openCV和深度学习(一)
语义分割:基于openCV和深度学习(一) Semantic segmentation with OpenCV and deep learning 介绍如何使用OpenCV.深度学习和ENet架构执行 ...