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. 三分钟了解B2B CRM系统的特点

    最近很多朋友想了解什么是B2B CRM系统,说到这里小Z先来给大家说说什么是B2B--B2B原本写作B to B,是Business-to-Business的缩写.正常来说就是企业与企业之间的生意往来 ...

  2. 克鲁斯卡尔(Kruskal)算法

    概览 相比于普里姆算法(Prim算法),克鲁斯卡尔算法直接以边为目标去构建最小生成树.从按权值由小到大排好序的边集合{E}中逐个寻找权值最小的边来构建最小生成树,只要构建时,不会形成环路即可保证当边集 ...

  3. Envoy:开启访问日志,access_log

    access_log: - name: envoy.listener.accesslog typed_config: "@type": type.googleapis.com/en ...

  4. 使用ldap客户端创建zimbra ldap用户的格式

    cat << EOF | ldapadd -x -W -H ldap://:389 -D "uid=zimbra,cn=admins,cn=zimbra" dn: ui ...

  5. [bug] Maven每次都自动下载jar包非常慢

    解决 方法一:将maven改为离线模式,自己下载jar包复制到仓库中 eclipse中Window>preferences>maven>勾选Offline 方法二:将maven镜像改 ...

  6. IT菜鸟之计算机软件

     一.计算机系统的分类 32位操作系统:32/u:更省资源:支持4G以内的内存 64位操作系统:64/u:速度更快:支持4G以外的内存 内存单位:B KB MB GB TB 换算:1024(2的10次 ...

  7. 大数据学习之路——环境配置(2)——mysql 在linux 系统上安装配置

    1.安装参考网址: https://blog.csdn.net/IronWring_Fly/article/details/103637801   设置新秘密: mysqladmin -u root ...

  8. 【python接口自动化】初识unittest框架

    本文将介绍单元测试的基础版及使用unittest框架的单元测试. 完成以下需求的代码编写,并实现单元测试 账号正确,密码正确,返回{"msg":"账号密码正确,登录成功& ...

  9. js获取cookie数据并发送给服务端

    js获取cookie数据并发送给服务端 <!DOCTYPE html> <html lang="en"> <head> <meta cha ...

  10. LATEX如何写多个条件推导式推出一个结论

    用markdown写推导式的时候,不太好写,故做个笔记记录一下,插入 公式块 : \left. \begin{aligned} \left. \begin{aligned} \text{这里可以写文字 ...