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.效率问题:用好的.合适的算法(前端程序员要把自己当 ...
随机推荐
- Serverless实践-静态网站托管
Serverless实践-静态网站托管 超多图预警!!! 本文旨在帮助不懂运维/网络/服务器知识的小白,在不租用云服务器的情况下,实现Web站点的上线部署 适合边看文章边跟着动手做 包含使用Githu ...
- 调用免费API查询全年工作日、周末、法定节假日、节假日调休补班数据
前言 日常开发中,难免会用到判断今天是工作日.周末.法定节假日.节假日调休补班做一些业务处理,例如:仅在上班时间给用户推送消息.本文记录调用免费API查询全年工作日.周末.法定节假日.节假日调休补班数 ...
- SpringBoot整合shiro系列-SpingBoot是如何将shiroFilter注册到servlet容器中的
一.先从配置类入手,主要是@Bean了一个ShiroFilterFactoryBean: @Data @Configuration @Slf4j @EnableConfigurationPropert ...
- [Qt] 项处理组件
项(Item):一个项存储了文字.文字的格式.自定义数据等. 1.项视图(Item View) 针对一个数据模型,可能有不同的展示需求,如文件夹中图片 ...
- 【转载】Linux查看PCIe版本及速率【方法】PCIE的X4X8X16 查看 数量 怎么看
Linux查看PCIe版本及速率 PCIE有四种不同的规格,通过下图来了解下PCIE的其中2种规格 查看主板上的PCI插槽 # dmidecode | grep --color "P ...
- CentOS7中下载RPM及其所有的依赖包
CentOS7中下载RPM及其所有的依赖包 转载beeworkshop 最后发布于2019-09-28 07:43:40 阅读数 1096 收藏 展开 利用 Downloadonly 插件下载 RP ...
- 7.12-7.19 id、w、who、last、lastb、lastlog
7.12-7.19 id.w.who.last.lastb.lastlog 目录 7.12 id:显示用户与用户组的信息 7.13 w:显示已登录用户信息 7.14 who:显示已登录用户信息 显示最 ...
- Linux_配置加密的https
一.配置https 1.安装好httpd服务后,安装mod_ssl模块 //首先查看是否安装mod_ssl [root@localhost ~]# rpm -qa | grep mod_ssl //安 ...
- [转载]屏幕PPI、分辨率到底需要多大才能满足?
屏幕PPI.分辨率到底需要多大才能满足? 郝蛋儿 江湖骗子 13 人赞同了该文章 最近想买一个43寸的电视,720P和1080P差了500大洋.我不禁纠结了起来.看网上争得面红耳赤,有的人说不如108 ...
- ELK学习实验020:ELK使用kafka缓存
首先安装一个kafka集群,但是zookeeper使用单节点,可以让kafka快速跑起来,后续再研究kafka和zokkeeper的集群 1 安装Kafka集群 下面是三个节点都要做 [root@no ...