开发者社区> 优惠码发放> 正文

js知识点清单

简介: js知识点清单 javaweb的js部分 自己总结的知识点清单,如果转发请注明出处,尊重原创,虽然写的不怎么样吧,哈哈 ,内容中有些时候是不连贯的,那是本人做的笔记,或者写的感想,不影响阅读。有错误的地方还请批评指正。
+关注继续查看

js知识点清单

javaweb的js部分

自己总结的知识点清单,如果转发请注明出处,尊重原创,虽然写的不怎么样吧,哈哈 ,内容中有些时候是不连贯的,那是本人做的笔记,或者写的感想,不影响阅读。有错误的地方还请批评指正。

Js部分

Document.write(“  ”)   可以往HTML里面写文字或者标签也可以

对大小写敏感

Alert(内容)     弹出一个对话框

Js事件

1.    事件

事件是可以被javascript检测到的行为

2.    主要事件

属性                                                                       描述

 

onClick                                                            单击事件

onMouseOver                                                 鼠标胫骨事件

onMouseOut                                                   鼠标移出事件

onChange                                                       文本内容改变事件

onSelect                                                           文本框选中事件

onFocus                                                          光标聚集事件

onBlur                                                             移开光标事件

onload                                                             网页加载事件

onUnload                                                        关闭网页事件

js的DOM对象

1.    DOM简介

DOM操作HTML

1) JavaScript能改变页面中的所有HTML元素

2) JavaScript能够改变页面中的所有HTML属性

3) JavaScript能够改变页面中的所有css样式

4) JavaScript能够对页面中的所有事件作出反应

2.    DOM操作HTML

1.1、     改变HTML输出流

注意。绝对不要在文档加载完成之后使用document.write()。这会覆盖该文档

1.2、     寻找元素

通过id寻找HTML元素

通过标签名找到HTML元素

1.3、     改变HTML内容

使用属性:innerHTML

1.4、     改变HTML属性

使用属性:attribute

2.      DOM操作css

2.1、     通过DOM对象改变css

语法:document.getElementById(id).style.property=new style;

3.      DOM-EventListener:

方法:addEventListener();

removeEventListener();

 

addEventListener(“事件比如click”,”方法名或者匿名函数”);                   用于向指定元素添加事件句柄

removeEventListener();         移除方法添加的事件句柄

js事件详解

1.    事件流

描述的是在页面中接受事件的顺序

1.1、     事件冒泡

由最具体的元素接受,然后逐级向上传播至最不具体的节点(文档)

1.2、     事件捕获

最不具体的节点先接受事件,而最具体的节点应该是最后接受事件

2.      事件处理

2.1、     HTML事件处理

直接添加到HTML结构中,比如直接添加到button中的onclick属性

2.2、     DOM的0级事件

把一个函数赋值给一个事件处理程序属性

Document.getElementById(id).onclick=function (){      }

弊端:当拥有多个事件的时候,那么脚本前面的事件会被覆盖掉

2.3、     DOM的2级事件

addEventListener(“事件名”,”事件处理函数”,”布尔值”);

true:事件捕获

false:事件冒泡

removeEventListener();

2.4、     IE事件处理程序小于等于IE8的

attachEvent

detachEvent

3.      事件对象

在触发DOM事件的时候,都会产生一个对象。

3.1、     事件对象event:

1):type:获取事件类型

2):target:获取事件目标

3):stopPropagation():阻止事件冒泡

不然会由小到大的范围执行一次

4):preventDefault():阻止事件的默认行为

Js内置对象

JavaScript中所有事物都是对象:字符串、数值、数组、函数、日期……

每个对象带有属性和方法

JavaScript允许自定义对象

1.    自定义对象

1):定义并创建实例对象

People = new Object();

2):使用函数来定义对象。然后创建新的对象实例

Functionpeople(age,name){

This.name=name;

This.age=age;

}

 

JsDOM对象控制HTML

1.    方法

getElementsByName()-------获取name

getElementsByTagName()-----------获取元素

getAttribute()----------------------获取元素属性

setAttribute()----------------------设置元素属性

childNodes()-----------------------访问子节点

parentNode()----------------------访问子节点

createElement()--------------------创建元素节点

createTextNode--------------------创建文本节点

insertBefore()----------------------插入节点

removeChild-----------------------删除节点

offsetHeight-----------------------网页尺寸(不包含滚动条)

scrollHeight------------------------网页尺寸(包含滚动条)

appendChild()---------------------添加到父节点的子节点

document.body.offsetHeight----------高度

document.body.offsetWidth----------宽度

 

js的浏览器对象

1.    window对象

window对象是BOM的核心,window对象是指当前的浏览器窗口,所有的JavaScript全局对象、函数以及变量均自动成为window对象的成员

全局变量是window的属性,

全局函数是window对象的方法

甚至HTML DOM的document也是window对象的属性之一。

1.1,     window尺寸

window.innerHeight------浏览器窗口的内部高度

window.innerWidth---------浏览器窗口的内部高毒

不包含工具栏和滚动条的

1.2,     window方法

window.open(“新的网页”.”网页名字”,”属性,比如width =100”)---打开新窗口

window.close()----关闭当前窗口

2.      计时器

2.1、计时事件:

通过JavaScript,我们有能力做到在一个设定的时间间隔之后来执行代码,而不是在函数被调用后立即执行,我们称之为计时事件。

2.2、计时方法:

1):setInterval(函数,毫秒)----------间隔指定的毫秒数不停地执行指定的代码

Vara= setInterval(…………)

clearInterval(a)

clearInterval()-----用于停止setInterval()执行的函数代码

2)setTimeout()—暂停指定的毫秒数执行指定的代码

clearTimeoutl()-----用于停止setTimeout ()执行的函数代码

 

参数位置和上面的一样,可以通过调用自己的函数来重复执行代码,来达到不断刷新的目的

3.      history对象

3.1、history对象

Window.history对象包含浏览器的历史(url)的集合

3.2、     history方法

history.back()------------与浏览器的后腿按钮相同

history.forward()---------与浏览器中的点击按钮向前相同

history.go(数字)--------------进入历史中某个页面

4.      location对象

window.location对象用于获取当前页面页面的地址(URL),并把重定向到新的页面

4.1,location的属性

Location.hostname       返回web主机的域名

Location.pathname      返回当前页面的路径和文件名

Location.port               返回web主机的端口

Location.protocol         返回所使用的web协议

Location.href               属性返回当前页面的url

Location.assign()         方法加载新的文档。跳转到某个页面

5.      Screen对象

Window.screen对象包含有关用户屏幕的信息

属性:

Screen.availWidth------可用的屏幕的宽度

Screen.availHeight------可用屏幕的高度

Screen.Height----------屏幕高度

Screen.width--------屏幕宽度

Js面向对象

,面向对象函数名字,既可以当成对象,函数也可以当成

this它代表函数运行时,自动生成的一个内部对象,只能在函数内部使用

随着函数使用场合的不同,this的值会发生变化。但是有一个总的原则,那就是this指的是,调用函数的那个对象

定义方式:

Function People(name){

This._name=name;

}

People.prototype.say= function(){

Alert(“hello”);

}

这是一个js的面向对象

用函数模拟一个类       prototype      原型链

第二种方式

FunctionPerson(name){

Var_this={}----------相当于创建一个对象承载了构造器

_this._name=name;

_this.sayHello=function(){

Alert(“hello”);

}

Return _this;

}

继承:

FunctionStudent(){

 

}

Student.prototype =     new People();--------继承

Vars = new Student();

s.say();

第二种方式

FunctionTeacher(){

Var  _this =Person();

VarsuperSay = _this.sayHello;

_this.sayHello= function(){

superSay,call(_this);

alert(“THello”);

}

Return_this;

}

封装:

{function(){

Function People(){

 

}

People.prototype.say= function(){

Alert(“hello”);

}

Window.People= People;------------如果想要调用内部的用window对象

}()

};--------------要加一个分号

 原文地址http://www.bieryun.com/2532.html

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
如何设置阿里云服务器安全组?阿里云安全组规则详细解说
阿里云安全组设置详细图文教程(收藏起来) 阿里云服务器安全组设置规则分享,阿里云服务器安全组如何放行端口设置教程。阿里云会要求客户设置安全组,如果不设置,阿里云会指定默认的安全组。那么,这个安全组是什么呢?顾名思义,就是为了服务器安全设置的。安全组其实就是一个虚拟的防火墙,可以让用户从端口、IP的维度来筛选对应服务器的访问者,从而形成一个云上的安全域。
18581 0
阿里云服务器如何登录?阿里云服务器的三种登录方法
购买阿里云ECS云服务器后如何登录?场景不同,阿里云优惠总结大概有三种登录方式: 登录到ECS云服务器控制台 在ECS云服务器控制台用户可以更改密码、更换系.
27723 0
阿里云服务器安全组设置内网互通的方法
虽然0.0.0.0/0使用非常方便,但是发现很多同学使用它来做内网互通,这是有安全风险的,实例有可能会在经典网络被内网IP访问到。下面介绍一下四种安全的内网互联设置方法。 购买前请先:领取阿里云幸运券,有很多优惠,可到下文中领取。
21933 0
阿里云服务器ECS登录用户名是什么?系统不同默认账号也不同
阿里云服务器Windows系统默认用户名administrator,Linux镜像服务器用户名root
15287 0
阿里云服务器端口号设置
阿里云服务器初级使用者可能面临的问题之一. 使用tomcat或者其他服务器软件设置端口号后,比如 一些不是默认的, mysql的 3306, mssql的1433,有时候打不开网页, 原因是没有在ecs安全组去设置这个端口号. 解决: 点击ecs下网络和安全下的安全组 在弹出的安全组中,如果没有就新建安全组,然后点击配置规则 最后如上图点击添加...或快速创建.   have fun!  将编程看作是一门艺术,而不单单是个技术。
19980 0
腾讯云服务器 设置ngxin + fastdfs +tomcat 开机自启动
在tomcat中新建一个可以启动的 .sh 脚本文件 /usr/local/tomcat7/bin/ export JAVA_HOME=/usr/local/java/jdk7 export PATH=$JAVA_HOME/bin/:$PATH export CLASSPATH=.
14852 0
阿里云服务器怎么设置密码?怎么停机?怎么重启服务器?
如果在创建实例时没有设置密码,或者密码丢失,您可以在控制台上重新设置实例的登录密码。本文仅描述如何在 ECS 管理控制台上修改实例登录密码。
23523 0
+关注
优惠码发放
阿里云优惠码阿里云推荐券bieryun.com
569
文章
4
问答
文章排行榜
最热
最新
相关电子书
更多
JS零基础入门教程(上册)
立即下载
性能优化方法论
立即下载
手把手学习日志服务SLS,云启实验室实战指南
立即下载