m0_52021758的博客

原创 JS入门笔记三十五：本地存储-sessionStorage、localStorage

本地存储的特性sessionStoragelocalStorage

原创 JS入门笔记三十四：mouseover和mouseenter的区别

原创 JS入门笔记三十三：scroll系列

原创 JS入门笔记三十二：立即执行函数

立即执行函数：立即执行函数是一种不用调用就直接执行的函数，其语法有以下两种( function([形参]) {函数体 } ) ( 实参 )( function([形参]) {函数体 } ( 实参 ) )

原创 JS入门笔记三十一：client系列

原创 JS入门笔记三十：offset系列

offset概述offset与style的区别

原创 JS入门笔记二十八：locationd对象

什么是URLlocation常用属性location常用方法

原创 JS入门笔记二十九：实现不同页面间1的数据交换

需求分析

原创 JS入门笔记二十七：JS的执行机制

JS的任务分类JS的任务执行顺序JS的执行机制

原创 JS入门笔记二十六：定时器

停止定时器间隔时间调用

原创 JS入门笔记二十五：调整窗口大小事件

原创 JS入门笔记二十四：窗口加载事件

窗口加载事件

原创 JS入门笔记二十三:初识BOM

BOM的构成window组成

原创 JS入门笔记二十二：键盘事件

down和up不区分大小写的ASCll的大小写，而press区分大小写

原创 JS入门笔记二十一：获取鼠标坐标

获取鼠标位置的方法

原创 JS入门笔记二十：禁止复制文本

在我们的网页中，有一些内容是不想让别人复制的，如何实现这个功能呢？要完成这个功能，我们要了解以下知识点：1.禁止鼠标右键菜单事件：contextmenu document.addEventLiatener('contextmenu ',funtion() { e.preventDefault(); })注册这个事件，鼠标不能点出右键菜单，但可以使用Ctrl+c复制2.禁止选中：selectstart document.addEventLiatener('selectst

原创 JS入门笔记十九：事件委托

事件委托也称事件流，在JQuery里称事件委派原理不需要给每个子节点设置事件监听器，而是事件监听器设置在父节点上，然后利用冒泡原理影响设置每个子节点作用：只操作一次DOM,提高程序性能...

原创 JS入门笔记十八：DOM事件流

什么是事件流事件对象定义：写在事件处理函数内的参数，若不写，系统会默认为event,但写了的话其实也不会改变事件对象，这是对事件对象进行了重命名而已，在ie678是，事件对象的写法都是window.event事件对象的常用属性注意：a.this是指向绑定事件的对象，target指向触发的对象b.阻止冒泡有兼容性问题，在低版本浏览器中要用window.event.cancelBubble...

原创 JS入门笔记十七：解绑事件

传统注册事件解绑：直接令事件等于null方法注册事件解绑：removeEventListener(事件名，函数名（函数名不需要带括号）)attach事件解绑：detachEvent(事件名，函数名（函数名不需要带括号）)

原创 JS入门笔记十六：注册事件

注册事件有两种方式，分别为传统方式和方法监听方式传统注册方式：方法监听注册方式语法attach方法，这是一个非标准方法，尽量不要在实际开发中使用

原创 JS入门笔记十五：DOM重点

DOM的核心主要是元素的增、删、改、查下面就让我们来归纳一些这些操作常用的方法增改查a.获取元素b.获取属性（主要是自定义属性）c.事件操作（鼠标）

原创 JS入门笔记十四：三种创建元素的方法的比较

原创 JS入门笔记十三：节点操作

节点概述节点的类型（nodeType）元素节点的为1属性节点的为2文本节点的为3节点操作和DOM提供的操作的差异性比较节点层级1.父节点：node.parentNode,若该节点无父节点则返回null`2. 子节点：node.childNode,返回的是集合，集合里为该元素的子节点，包括元素节点和文本节点。`3. 获得子元素节点的方法：a.利用inodeType筛选子元素节点b.用 children获取（大多数浏览器都支持）4.兄弟节点:a.获取兄弟节点：nextSibling

原创 JS入门笔记十二：属性操作

自定义属性：自定义属性即程序员自己定义的属性，通常是为了满足实际开发中一些特殊的要求，如在网页保存一些数据；自定义属性的方法就是在标签内些** “属性名 = ‘属性值’ ” **即可。获取属性值的方法1.Element.属性名,这种方法主要用于获取元素自身属性值2.Element.getAttribute(‘属性名’)，这种方法主要用于获取自定义属性值3.Element[‘属性名’]设置属性值1.Element.属性名 = 属性值这种方法主要用于设置元素自身属性值2.Element.setAt

原创 JS入门笔记：获取文档对象

DOM获取元素的方法1.getElementById(参数)a.参数为元素的id，并且是字符串形式b.返回的是一个元素对象c.使用console.dir()打印获取的元素可以更好的察看其相关属性和方法2.根据标签名来获取元素：getElementsByTagName()a.因为一个HTML中有很多相同的标签，所有返回的是对象的集合，以伪数组的形式存储b.得到的元素是动态的，动态即当标签内容改变时，js获取的对象内容会自动改变c.如果页面中没有此元素，则返回一个空的伪数组d.获取父元素里的子

原创 JS入门笔记十一：密码框提示信息

当我们在一些网站输入或者注册账号密码时会出现这些效果：1.当输入密码的格式不正确时密码框后会有提示，如“含有非法字符”等2.当密码的位数超出或者少于要求时会有提示，如“输入错误，密码为6~16位”3.当密码输入正确时会有提示：“密码正确”4.当密码框为空时会提示：“请输入密码”分析：此案例涉及的修改信息较多，且不同的条件下修改的内容不同，那么我们可以采取分块涉及的方法，将上面的4个要求分为四个类，当满足相应的条件后，用className = ‘类名’ 对其进行相应的选择即可...

原创 JS入门笔记十：显示隐藏文本框内容

分析：在我们打开百度、京东等时，会发现这样一个现象：它们的搜索框内有文字，但是当我们的光标在搜索框内时，搜索框内的内容会消失，当光标离开且搜索框内为空时，默认内容又会显示出来。想实现这个功能，我们要先了解两个事件onfocus和onblur。onfocus表示获得焦点，onblur表示失去焦点。有了这两个事件我们就可以完成上面所说的功能了。但input获得焦点时并且框中的内容不是默认文字的话，我们可以令input框中的内容变成空；当input失去焦点并且框中的内容为空时显示默认内容，需要注意的是，所谓的

原创 JS入门笔记九：循环精灵图案例

在开发中，精灵图往往是按照一定规律制作的，前端程序员往往可以借助其规律来快速制作相应的图标，提升开发效率。操作步骤：1.寻找精灵图的排布规律2.按照规律改变背景位置以淘宝为例这是淘宝精灵图的一部分，通过测量可知每个小图片间的间隔为22px,且图片大小为2222，所有每个精灵图在x轴的坐标为0，在y轴的坐标为-44(i-1),如第一张精灵图的x为0，y为-44*（1-1）=0；由此规律，我们利用循环就可以将其全部制作。...

原创 JS入门笔记八：操作元素

1.修改元素内容：innerText、innerHTML都可以修改元素的文字内容，但innerText不识别标签，同时会自动的去除空格和换行，innerHTML没有这些问题，推荐使用innerHTML

原创 JS入门笔记七：事件基础

事件的组成：1.事件源：事件被触发的对象2.事件类型：事件触发的方式，如鼠标点击、经过等3.事件的处理程序执行事件的步骤1.获取事件源2.注册事件3.添加事件处理程序常见鼠标事件

原创 JS入门笔记六：DOM简介

什么是DOMDOM为Document Object Model,即文档对象模型，是W3C推荐处理可扩展标记语言（HTML或XML）的标准接口DOM树DOM获取元素的方法1.getElementById(参数)a.参数为元素的id，并且是字符串形式b.返回的是一个元素对象c.使用console.dir()打印获取的元素可以更好的察看其相关属性和方法2.根据标签名来获取元素：getElementsByName()a.因为一个HTML中有很多相同的标签，所有返回的是对象的集合，以伪数组的形式存

原创 JS入门笔记五：初识Web APIs

Web APIs是用来干什么的？在第一天学习JavaScript的时候，我们就了解了JS可以使网页具有丰富多彩的动态效果，但经过两天的学习，我还是不知道如何给网页做动态效果，因为这两天我学习的内容是ECMAScript部分，这部分知识是JS的基础内容，而对网页进行相关操作的内容都在BOM和DOM部分，这两个部分是JS的核心，学习完这两个部分，要求我们可以掌握一些基础Web APIs的使用，来对网页进行一些简单的动态布局。...

原创 JS入门笔记四：内置对象

**JavaScript的对象：**自定义对象、内置对象、浏览器对象内置对象：JS内自带的一些对象，提供给开发者使用，帮助其快速开发；常见的内置对象有Math、Date、Array、String等。查阅文档1.

原创 JS入门笔记三：对象

什么是对象？在现实生活中万物皆对象，对象是一个具体事物，看得见摸得着的实物，如一本书、一辆汽车等等可以是对象，一个数据库、一张网页、一个与远程服务器的连接也可是对象。在javaScript中，对象是一组无序的相关属性和方法的集合，所有事务都是对象，如字符串、数值、数组函数等。类似C语言的结构体创建对象的方法1.字面量法： var obj = { name: 'xxx' , age: 18, sex: 'M', sayHi: funtion() {

原创 JS入门笔记二：注释、变量即相关操作

注释：1.单行注释：//2.多行注释：/* */输入、输出语句：变量JavaScript是一门弱类型语言，变量申明只有var，数据类型是程序在编译的时候根据等号右边的值来确定的，而不像其他强类型语言一样在定义变量的时候要先申明数据类型。变量命名规范JS的数据类型1.简单型（基本数据类型）注意1.Number型的三个特殊值：Infinite（无穷大）、-Infinite（无穷小）、NaN(非数值)。2.判断变量是否为数字型：isNaN(变量)，返回值为boolearn类型。3

原创 JS入门笔记一：初识JavaScript

问：什么是javaScript?答： javaScript是世界上最流行的语言之一，是一种运行在客户端的脚本语言问：什么叫运行在客户端的语言？答： 客户端通常是我们自己的PC,运行在客户端的语言通常是不需要额外进行环境配置就可以直接在PC上执行的语言；与之相对的还有运行在服务器上的语言，我们在运行这些语言是需要先进行环境搭配，比如运行JAVA时，我们先要下载JDK。问：什么是脚本语言呢？**答：**脚本语言(Script languages,scripting programming langua

原创 CSS入门笔记三十一：网页开发注意事项

一、网页开发流程二、搜索引擎优化三、模块化开发四、

原创 CSS入门笔记三十：网页faviaon图标制作

一、选取自己想要的图片剪切保存二、将图片转化为.ico格式的，favicon图标只支持此格式。推荐网站：比特虫（http://www.bitbug.net/），里面有教程帮助你直接转化三、将转化的图片引入<head></head>内，引入标签：<link rel="shortcut icon" href="/favicon.ico" />...

原创 CSS入门笔记二十九：过渡属性

1.过渡的定义及使用过渡语法

原创 CSS入门笔记二十八：CSS3盒子模型border-box

1.CSS3盒子模型2.其他属性扩展：a.图像模糊：filter :blur(像素值)；像素值越大越模糊b.calc函数：