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的更多相关文章

  1. Data Visualization and D3.js 笔记(1)

    课程地址: https://classroom.udacity.com/courses/ud507 什么是数据可视化? 高效传达一个故事/概念,探索数据的pattern 通过颜色.尺寸.形式在视觉上表 ...

  2. js笔记-0

    #js笔记-0 数组: indexOf方法: Array也可以通过indexOf()来搜索一个指定的元素的位置: var arr = [10, 20, '30', 'xyz']; arr.indexO ...

  3. PPK谈JS笔记第一弹

    以下内容是读书笔记,再一次温习JS好书:PPK谈JS window.load=initializePageaddEventSimple('window','load',function(){}) lo ...

  4. 面向小白的JS笔记 - #Codecademy#学习笔记

    前言 最初浏览过<JavaScript秘密花园>,前一段时间读过一点点<JavaScript语言精粹>和一点点<JavaScript高级程序设计>(一点点是指都只是 ...

  5. require.js笔记

    笔记参考来源:阮一峰  http://www.ruanyifeng.com/blog/2012/10/javascript_module.html   1. 浏览器端的模块只能采用“异步加载”方式 = ...

  6. JS笔记 入门第四

    小测试: 注意:取消所有的设定可以直接使用 document.getElementById("txt").removeAttribute("style"); 这 ...

  7. JS笔记 入门第二

    输出内容 document.write(); alert("hello!"); alert(mynum); </script> 注:alert弹出消息对话框(包含一个确 ...

  8. Node.js笔记1

    Node.js入门笔记 1. node -help 可以显示帮助信息2. node REPL 模式(Read-eval-print loop) 输入—求值—输出循环 直接在cmd输入node 可以进入 ...

  9. JS笔记 入门第一

    WHY? 一.你知道,为什么JavaScript非常值得我们学习吗? 1. 所有主流浏览器都支持JavaScript. 2. 目前,全世界大部分网页都使用JavaScript. 3. 它可以让网页呈现 ...

  10. 奇舞js笔记——第0课——如何写好原生js代码

    摘要 1.好的代码职责要清晰,javscript不要用来操作样式: 2.API要设计的合理:通用性,适度的抽象(数据抽象,过程抽象),可扩展性: 3.效率问题:用好的.合适的算法(前端程序员要把自己当 ...

随机推荐

  1. for 循环语句 (enumerate枚举,据说直接写出索引值)

    for i in ***: 今天上课看到alex用了 for index,i in enumerate(list): print(index,i) (enumerate好像可以设置开头序号enumer ...

  2. [刷题] 416 Partition Equal Subset Sum

    要求 非空数组的所有数字都是正整数,是否可以将这个数组的元素分成两部分,使得每部分的数字和相等 最多200个数字,每个数字最大为100 示例 [1,5,11,5],返回 true [1,2,3,5], ...

  3. 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. ...

  4. 自用Chrome插件推荐【附教程及下载】

    自用Chrome插件推荐[附教程及下载] 豆子   1,675 人赞同了该文章 2019.11.03更新 原文同步发布在我的个人博客 Chrome插件自用​blog.douzi.work 都是我自己一 ...

  5. 韩小韩 API接口

    官方网址:https://api.vvhan.com/ 天气API接口: https://api.vvhan.com/api/weather Bing每日图片API接口: https://api.vv ...

  6. nmap扫描端口导致线上大量Java服务FullGC甚至OOM

    nmap扫描端口导致线上大量Java服务FullGC甚至OOM 最近公司遇到了一次诡异的线上FullGC保障,多个服务几乎所有的实例集中报FullGC,个别实例甚至出现了OOM,直接被docker杀掉 ...

  7. Azure DevOps(二)利用Azure DevOps Pipeline 构建基础设施资源

    一,引言 上一篇文章记录了利用 Azure DevOps 跨云进行构建 Docker images,并且将构建好的 Docker Images 推送到 AWS 的 ECR 中.今天我们继续讲解 Azu ...

  8. Go slice 扩容机制分析

    前言 我们都知道 Go 语言中的 slice 具有动态扩容的机制(不知道的同学请先补课 Go 切片) 但是其底层机制是什么呢?本着知其然,知其所以然的探索精神去研究一番.还不是为了应试 手动狗头 go ...

  9. RADAR毫米波雷达传感器

    RADAR毫米波雷达传感器 TI 利用先进的集成式射频 CMOS 雷达技术提供品类齐全的 60GHz 和 77GHz 传感器产品系列 通过高性能集成射频互补金属氧化物半导体 (CMOS) 雷达技术,可 ...

  10. 语义分割:基于openCV和深度学习(一)

    语义分割:基于openCV和深度学习(一) Semantic segmentation with OpenCV and deep learning 介绍如何使用OpenCV.深度学习和ENet架构执行 ...