摘要:
什么是ajax AJAX = 异步的javascript和XML(Asynchronous Javascript and XML) 简言之,在不重载整个网页的情况下,AJAX通过后台加载数据,并在网页上进行显示。 通过 jQuery AJAX 方法,您能够使用 HTTP Get 和 HTTP Pos 阅读全文
posted @ 2018-06-04 21:46
大白1#
阅读(265)
评论(0)
推荐(0)
摘要:
无缝轮播实现(比较考验逻辑思维) 模仿京东轮播图效果 阅读全文
posted @ 2018-06-04 21:45
大白1#
阅读(155)
评论(0)
推荐(0)
摘要:
什么是事件委托 通俗的讲,事件就是onclick,onmouseover,onmouseout,等就是事件,委托呢,就是让别人来做,这个事件本来是加在某些元素上的,然而你却加到别人身上来做,完成这个事件。 举个列子:有三个同事预计会在周一收到快递。为签收快递,有两种办法:一是三个人在公司门口等快递; 阅读全文
posted @ 2018-06-04 21:44
大白1#
阅读(129)
评论(0)
推荐(0)
摘要:
1、绑定事件 语法: 描述:为每一个匹配元素的特定事件(像click)绑定一个事件处理器函数。 参数解释: type (String) : 事件类型 data (Object) : (可选) 作为event.data属性值传递给事件对象的额外数据对象 fn ( Function) : 绑定到每个匹配 阅读全文
posted @ 2018-06-04 21:43
大白1#
阅读(133)
评论(0)
推荐(0)
摘要:
上篇介绍完我们js的事件流的概念之后,相信大家对事件流也有所了解了。那么接下来我们看一下jquery的事件操作。 在说jquery的每个事件之前,我们先来看一下事件对象 事件对象 Event 对象代表事件的状态,比如事件在其中发生的元素、键盘按键的状态、鼠标的位置、鼠标按钮的状态。 例如: 当用户单 阅读全文
posted @ 2018-06-04 21:42
大白1#
阅读(124)
评论(0)
推荐(0)
摘要:
jQuery的位置信息跟JS的client系列、offset系列、scroll系列封装好的一些简便api. 一、宽度和高度 获取宽度 描述:为匹配的元素集合中获取第一个元素的当前计算宽度值。这个方法不接受任何参数。.css(width) 和 .width()之间的区别是后者返回一个没有单位的数值(例 阅读全文
posted @ 2018-06-04 21:41
大白1#
阅读(94)
评论(0)
推荐(0)
摘要:
在学习jQuery的事件之前,大家必须要对JS的事件有所了解。看下文 事件的概念 HTML中与javascript交互是通过事件驱动来实现的,例如鼠标点击事件、页面的滚动事件onscroll等等,可以向文档或者文档中的元素添加事件侦听器来预订事件。想要知道这些事件是在什么时候进行调用的,就需要了解一 阅读全文
posted @ 2018-06-04 21:41
大白1#
阅读(83)
评论(0)
推荐(0)
摘要:
代码如下: 阅读全文
posted @ 2018-06-04 21:39
大白1#
阅读(179)
评论(0)
推荐(0)
摘要:
之前js中咱们学习了js的DOM操作,也就是所谓的增删改查DOM操作。通过js的DOM的操作,大家也能发现,大量的繁琐代码实现我们想要的效果。那么jQuery的文档操作的API提供了便利的方法供我们操作我们的文档。 看一个之前我们js操作DOM的例子: 一.插入操作 知识点1: 语法: 解释:追加某 阅读全文
posted @ 2018-06-04 21:38
大白1#
阅读(174)
评论(0)
推荐(0)
摘要:
表单控件是我们的重中之重,因为一旦牵扯到数据交互,离不开form表单的使用,比如用户的注册登录功能等 那么通过上节知识点我们了解到,我们在使用jquery方法操作表单控件的方法: 看如下HTML结构: 页面展示效果: 操作表单控件代码如下: 阅读全文
posted @ 2018-06-04 21:37
大白1#
阅读(646)
评论(0)
推荐(0)
摘要:
jquery的属性操作模块分为四个部分:html属性操作,dom属性操作,类样式操作和值操作 html属性操作:是对html文档中的属性进行读取,设置和移除操作。比如attr()、removeAttr() DOM属性操作:对DOM元素的属性进行读取,设置和移除操作。比如prop()、removePr 阅读全文
posted @ 2018-06-04 21:30
大白1#
阅读(101)
评论(0)
推荐(0)
摘要:
jQuery提供的一组网页中常见的动画效果,这些动画是标准的、有规律的效果;同时还提供给我们了自定义动画的功能。 显示动画 方式一: 解释:无参数,表示让指定的元素直接显示出来。其实这个方法的底层就是通过display: block;实现的。 方式二: 解释:通过控制元素的宽高、透明度、displa 阅读全文
posted @ 2018-06-04 19:37
大白1#
阅读(107)
评论(0)
推荐(0)
摘要:
我们以前在CSS中学习的选择器有: 今天来学习一下jQuery 选择器。 jQuery选择器是jQuery强大的体现,它提供了一组方法,让我们更加方便的获取到页面中的元素。 1、jQuery 的基本选择器 代码如下: 效果如下: 2、层级选择器 代码如下: 效果如下: 3、基本过滤选择器 解释: 代 阅读全文
posted @ 2018-06-04 19:25
大白1#
阅读(103)
评论(0)
推荐(0)
摘要:
1.为什么要使用jQuery 在用js写代码时,会遇到一些问题: window.onload 事件有事件覆盖的问题,因此只能写一个事件。 代码容错性差。 浏览器兼容性问题。 书写很繁琐,代码量多。 代码很乱,各个页面到处都是。 动画效果很难实现。 window.onload 事件有事件覆盖的问题,因 阅读全文
posted @ 2018-06-04 19:22
大白1#
阅读(154)
评论(0)
推荐(0)
摘要:
模拟百度导航栏滚动监听 代码如下: 阅读全文
posted @ 2018-06-04 19:18
大白1#
阅读(98)
评论(0)
推荐(0)
摘要:
1、client系列 代码如下: 2.屏幕的可视区域 3.offset系列 代码如下,注释都挺清楚的 4.scroll系列 代码如下: 阅读全文
posted @ 2018-06-04 19:14
大白1#
阅读(121)
评论(0)
推荐(0)
摘要:
BOM的介绍 JavaScript基础分为三个部分: ECMAScript:JavaScript的语法标准。包括变量、表达式、运算符、函数、if语句、for语句等。 DOM:文档对象模型,操作网页上的元素的API。比如让盒子移动、变色、轮播图等。 BOM:浏览器对象模型,操作浏览器部分功能的API。 阅读全文
posted @ 2018-06-04 19:02
大白1#
阅读(153)
评论(0)
推荐(0)
摘要:
在js中的定时器分两种:1、setTimeout() 2、setInterval() 1.setTimeOut() 只在指定时间后执行一次 2.setInterval() 在指定时间为周期循环执行 两种方法根据不同的场景和业务需求择而取之, 对于这两个方法,需要注意的是如果要求在每隔一个固定的时间间 阅读全文
posted @ 2018-06-04 19:00
大白1#
阅读(96)
评论(0)
推荐(0)
摘要:
创建对象的几种常用方式 1.使用Object或对象字面量创建对象 2.工厂模式创建对象 3.构造函数模式创建对象 4.原型模式创建对象 1.使用Object或对象字面量创建对象 JS中最基本创建对象的方式: 这样,一个student对象就创建完毕,拥有2个属性name以及age,分别赋值为"easy 阅读全文
posted @ 2018-06-04 18:03
大白1#
阅读(112)
评论(0)
推荐(0)
摘要:
1.模态框案例 需求: 打开网页时有一个普通的按钮,点击当前按钮显示一个背景图,中心并弹出一个弹出框,点击X的时候会关闭当前的模态框 代码如下: 2.简易留言板 需求: 当在textarea中输入内容,点击留言按钮,会添加到浏览器中 图如下: 代码如下: 3.使用js模拟选择器中hover 代码解释 阅读全文
posted @ 2018-06-04 17:56
大白1#
阅读(119)
评论(0)
推荐(0)
摘要:
什么是DOM DOM:文档对象模型。DOM 为文档提供了结构化表示,并定义了如何通过脚本来访问文档结构。目的其实就是为了能让js操作html元素而制定的一个规范。 DOM就是由节点组成的。 解析过程 HTML加载完毕,渲染引擎会在内存中把HTML文档,生成一个DOM树,getElementById是 阅读全文
posted @ 2018-06-04 17:54
大白1#
阅读(150)
评论(0)
推荐(0)
摘要:
一、JavaScript的组成 JavaScript基础分为三个部分: ECMAScript:JavaScript的语法标准。包括变量、表达式、运算符、函数、if语句、for语句等。 DOM:文档对象模型,操作网页上的元素的API。比如让盒子移动、变色、轮播图等。 BOM:浏览器对象模型,操作浏览器 阅读全文
posted @ 2018-06-04 17:52
大白1#
阅读(99)
评论(0)
推荐(0)
摘要:
arguments代表的是实参。有个讲究的地方是:arguments只在函数中使用。 (1)返回函数实参的个数:arguments.length 例子: 结果: (2)之所以说arguments是伪数组,是因为:arguments可以修改元素,但不能改变数组的长短。举例: 清空数组的几种方式: 阅读全文
posted @ 2018-06-04 17:49
大白1#
阅读(115)
评论(0)
推荐(0)
摘要:
函数:就是将一些语句进行封装,然后通过调用的形式,执行这些语句。 函数的作用: 将大量重复的语句写在函数里,以后需要这些语句的时候,可以直接调用函数,避免重复劳动。 简化编程,让编程模块化。 将大量重复的语句写在函数里,以后需要这些语句的时候,可以直接调用函数,避免重复劳动。 简化编程,让编程模块化 阅读全文
posted @ 2018-06-04 17:47
大白1#
阅读(139)
评论(0)
推荐(0)
摘要:
所谓内置对象就是ECMAScript提供出来的一些对象,我们知道对象都是有相应的属性和方法 数组Array 1.数组的创建方式 字面量方式创建(推荐大家使用这种方式,简单粗暴) 使用构造函数(后面会讲)的方式创建 使用new关键词对构造函数进行创建对象 2.数组的赋值 3.数组的常用方法 3.1 数 阅读全文
posted @ 2018-06-04 16:20
大白1#
阅读(100)
评论(0)
推荐(0)
摘要:
1.if 、if-else、if-else if-else 2.逻辑与&&、逻辑或|| 3.switch 4.while循环 循环三步走: 1.初始化循环变量 2.判断循环条件 3.更新循环变量 练习:将1-100所有是2的倍数在控制台中打印。使用while循环 5.do_while 6.for循环 阅读全文
posted @ 2018-06-04 16:17
大白1#
阅读(142)
评论(0)
推荐(0)
摘要:
语言中我们的数据类型有很多,在某个页面中展示的数据类型也不同,比如说电话号码我就要求number的类型,而输入姓名的时候就要求string类型的。那么在适当的情况下我们可以将数据类型进行转换。 1.将数值类型转换成字符串类型 隐式转换 强制类型转换 2.将字符串类型转换成数值类型 3.任何数据类型都 阅读全文
posted @ 2018-06-04 16:15
大白1#
阅读(134)
评论(0)
推荐(0)
摘要:
js中的运算符跟python中的运算符有点类似,但也有不同。所谓运算,在数学上,是一种行为,通过已知量的可能的组合,获得新的量。 1.赋值运算符 以var x = 12,y=5来演示示例| 2.算数运算符 var a = 5,b=2 3.比较运算符 var x = 5; 4.特殊情况 字符串拼接+字 阅读全文
posted @ 2018-06-04 16:12
大白1#
阅读(154)
评论(0)
推荐(0)
摘要:
数据类型包括:基本数据类型和引用数据类型 基本数据类型指的是简单的数据段,引用数据类型指的是有多个值构成的对象。 当我们把变量赋值给一个变量时,解析器首先要确认的就是这个值是基本类型值还是引用类型值 1.基本数据类型 number string boolean null undefined 2.引用 阅读全文
posted @ 2018-06-04 16:11
大白1#
阅读(148)
评论(0)
推荐(0)
摘要:
在页面中,我们可以在body标签中放入<script type=”text/javascript”></script>标签对儿,<script type=”text/javascript”></script>标签对儿 alert语句 alert(英文翻译为“警报”)的用途:弹出“警告框”。 语法规则 阅读全文
posted @ 2018-06-04 16:10
大白1#
阅读(125)
评论(0)
推荐(0)
摘要:
Web前端有三层: HTML:从语义的角度,描述页面结构 CSS:从审美的角度,描述样式(美化页面) JavaScript:从交互的角度,描述行为(提升用户体验) JavaScript历史背景介绍 布兰登 • 艾奇(Brendan Eich,1961年~),1995年在网景公司,发明的JavaScr 阅读全文
posted @ 2018-06-04 16:09
大白1#
阅读(129)
评论(0)
推荐(0)
摘要:
z-index 这个东西非常简单,它有四大特性,每个特性你记住了,页面布局就不会出现找不到盒子的情况。 z-index 值表示谁压着谁,数值大的压盖住数值小的, 只有定位了的元素,才能有z-index,也就是说,不管相对定位,绝对定位,固定定位,都可以使用z-index,而浮动元素不能使用z-ind 阅读全文
posted @ 2018-06-04 16:07
大白1#
阅读(77)
评论(0)
推荐(0)
摘要:
定位 定位有三种: 1.相对定位 2.绝对定位 3.固定定位 这三种定位,每一种都暗藏玄机,所以我们要一一单讲。 相对定位 相对定位:相对于自己原来的位置定位 现象和使用: 1.如果对当前元素仅仅设置了相对定位,那么与标准流的盒子什么区别。 2.设置相对定位之后,我们才可以使用四个方向的属性: to 阅读全文
posted @ 2018-06-04 16:06
大白1#
阅读(95)
评论(0)
推荐(0)
摘要:
先来讲讲颜色表示法 一共有三种:单词、rgb表示法、十六进制表示法 rgb:红色 绿色 蓝色 三原色光学显示器,每个像素都是由三原色的发光原件组成的,靠明亮度不同调成不同的颜色的。用逗号隔开,r、g、b的值,每个值的取值范围0~255,一共256个值。如果此项的值,是255,那么就说明是纯色:黑色: 阅读全文
posted @ 2018-06-04 16:05
大白1#
阅读(166)
评论(0)
推荐(0)
摘要:
直接上代码了 html结构 写好上面的结构代码之后,也就是将我们页面展示的内容显示了,但是我们此时要利用我们学过的知识点来布局页面 首先我们要做导航栏,并排显示元素,第一想 浮动,想到使用浮动之后,一定记得清除浮动元素。 css代码如下: 阅读全文
posted @ 2018-06-04 16:02
大白1#
阅读(138)
评论(0)
推荐(0)
摘要:
文本属性 介绍几个常用的。 文本对齐 text-align 属性规定元素中的文本的水平对齐方式。 属性值:none | center | left | right | justify 文本颜色 color属性 文本首行缩进 text-indent 属性规定元素首行缩进的距离,单位建议使用em 文本修 阅读全文
posted @ 2018-06-04 16:01
大白1#
阅读(167)
评论(0)
推荐(0)
摘要:
margin塌陷问题 当时说到了盒模型,盒模型包含着margin,为什么要在这里说margin呢?因为元素和元素在垂直方向上margin里面有坑。 我们来看一个例子: html结构: css样式: 当给两个标准流下兄弟盒子 设置垂直方向上的margin时,那么以较大的为准,那么我们称这种现象叫塌陷。 阅读全文
posted @ 2018-06-04 16:00
大白1#
阅读(148)
评论(0)
推荐(0)
摘要:
浮动 浮动是css里面布局最多的一个属性,也是很重要的一个属性。 float:表示浮动的意思。它有四个值。 none: 表示不浮动,默认 left: 表示左浮动 right:表示右浮动 看一个例子 html结构: css样式: 我们会发现,三个元素并排显示,.box1和span因为是左浮动,紧挨在一 阅读全文
posted @ 2018-06-04 15:59
大白1#
阅读(173)
评论(0)
推荐(0)
摘要:
学习的初期,我们就要知道,标准文档流等级森严。标签分为两种等级: 行内元素 块级元素 比如h1标签和span,同时设置宽高,来看浏览器效果,那么你会发现: 行内元素和块级元素的区别:(非常重要) 行内元素: 与其他行内元素并排; 不能设置宽、高。默认的宽度,就是文字的宽度。 块级元素: 霸占一行,不 阅读全文
posted @ 2018-06-04 15:38
大白1#
阅读(121)
评论(0)
推荐(0)
摘要:
什么是标准文档流 宏观的将,我们的web页面和ps等设计软件有本质的区别,web 网页的制作,是个“流”,从上而下 ,像 “织毛衣”。而设计软件 ,想往哪里画东西,就去哪里画 标准文档流下 有哪些微观现象? 1.空白折叠现象 多个空格会被合并成一个空格显示到浏览器页面中。img标签换行写。会发现每张 阅读全文
posted @ 2018-06-04 15:37
大白1#
阅读(115)
评论(0)
推荐(0)
摘要:
margin margin:外边距的意思。表示边框到最近盒子的距离。 阅读全文
posted @ 2018-06-04 15:36
大白1#
阅读(314)
评论(0)
推荐(0)
摘要:
边框 border:边框的意思,描述盒子的边框 边框有三个要素: 粗细 线性样式 颜色 如果颜色不写,默认是黑色。如果粗细不写,不显示边框。如果只写线性样式,默认的有上下左右 3px的宽度,实体样式,并且黑色的边框。 按照3要素来写border 按照方向划分 上面12条语句,相当于 bordr: 1 阅读全文
posted @ 2018-06-04 15:35
大白1#
阅读(288)
评论(0)
推荐(0)
摘要:
padding padding:就是内边距的意思,它是边框到内容之间的距离 另外padding的区域是有背景颜色的。并且背景颜色和内容的颜色一样。也就是说background-color这个属性将填充所有的border以内的区域 padding的设置 padding有四个方向,分别描述4个方向的pa 阅读全文
posted @ 2018-06-04 15:33
大白1#
阅读(161)
评论(0)
推荐(0)
摘要:
盒模型 在CSS中,"box model"这一术语是用来设计和布局时使用,然后在网页中基本上都会显示一些方方正正的盒子。我们称为这种盒子叫盒模型。 盒模型有两种:标准模型和IE模型。我们在这里重点讲标准模型。 盒模型示意图 盒模型的属性 width:内容的宽度 height: 内容的高度 paddi 阅读全文
posted @ 2018-06-04 15:31
大白1#
阅读(92)
评论(0)
推荐(0)
摘要:
08-层叠性权重相同处理 直接上代码,看效果! 第一种现象:当权重相同时,以后来设置的属性为准,前提一定要权重相同 #box2 .wrap3 p{ color: yellow; } #box1 .wrap2 p{ color: red; } 我们会发现此时显示的是红色的。 第二种现象: 第一个选择器 阅读全文
posted @ 2018-06-04 15:29
大白1#
阅读(131)
评论(0)
推荐(0)

浙公网安备 33010602011771号