2018年01月_purple_lumpy

原创 jQuery 基础筛选和遍历 jQuery 对象

给一个 jQuery 对象增加一个元素：- 用逗号- 用 add() 方法 console.log( $('div,li') ) console.log( $('div').add('li') )给一个 jQuery 对象过滤（删除）元素：- not(selector)- filter(selector) 是not() 的互补方法

2018-01-31 11:03:03 451

原创 jQuery 基础通过关系查找 jQuery 对象

获取父元素- 使用jquery 对象的 parents() 方法，方法中还可以加入字符串进行过滤；parent() 方法返回的是直接父元素；parentsUntil()。 var lis = $('li'); var pa = lis.parents() var ul = lis.parents("ul")- 使用 jQuery 对象的closest() 方法，对当前元素

2018-01-30 15:35:32 241

原创 jQuery 基础操作 jQuery 对象

操作 jQuery 对象- 检查数量- 父子邻居关系- 过滤元素的集合- 遍历用 jQuery 创建 html 元素dom 对象（元素）与 jQuery 对象：前者是浏览器的网页页面中渲染出来的元素，而后者是对一组 dom 元素的包装。检查 DOM 对象：if(obj.nodeType)检查 jQuery 对象： if(obj.jquery)转换：

2018-01-29 22:20:37 457

原创 jQuery 基础选择器

首先，JavaScript 选择元素- document.getElementById() 【返回的是元素】- document.getElementsByName() 【返回的是NodeList】- document.getElementsByTagName() 【返回的是HTMLCollection】- document.getElementsByClassName

2018-01-28 18:44:21 133

原创 JQuery 基础使用

JQuery 是javascript 的一个库它能方便地处理HTML（DOM节点增加删除）、事件、动画等；它可以兼容许多浏览器，不用考虑原生JS 的兼容性问题。使用JQuery 两种方式- 下载 JQuery 文件（官网，js文件），在html文件中，通过中的 src 属性添加- CDN 内容分发网络，也是在html文件中，通过中的 src 属性添加

2018-01-28 15:35:29 163

原创 Javascript 基础 BOM

BOM (Browser Object Model) 浏览器对象模型BOM 提供的对象：（用于访问浏览器的功能） - window - navigator - screen - history - location - document - event(1) window 对象window 是浏览器的一个示例，在浏览器中，window 对象有双重角色

2018-01-22 15:58:06 173

原创 Javascript 基础 DOM 事件

javascript 事件基础- 事件- HTML 事件- DOM 0级事件- 常用的鼠标与键盘事件- this 的指向事件：文档或浏览器窗口中发生的一些特定的交互瞬间。事件的绑定方式：HTML 事件，DOM 0级事件。鼠标事件- onload：页面加载时触发- oclick：鼠标点击时触发- onmouseover：鼠标滑过时触发-

2018-01-21 18:55:38 166

原创 Javascript 基础 DOM 基础

DOM1. 获取元素 - document.getElementById() - document.getElementsByTagName()2. 给元素设置样式 - element.style.styleName = styleValue (设置element元素的CSS样式) 说明：a. element为要设置样式的DOM对象

2018-01-21 17:45:49 161

原创 Javascript 基础内置对象

Javascript 中的内置对象- Array- String- Math- Date（1） ECMAScript 中数组- 元素的类型不必一致- 数组长度大小可变创建数组： 1. 使用Array构造函数语法： new Array() var dontknow = new Array(); var colors = new Array(

2018-01-15 16:55:29 150

原创 Javascript 基础一些操作

- 获取星期语法： new Date().getDay()返回值：number(0-6)- 输出语法：document.write("内容")功能：向浏览器输出内容

2018-01-12 11:32:40 110

原创 Javascript 基础 alert 与 prompt

- alert 网页上弹出警告框语法： alert("出现的文字内容")- prompt网页上弹出输入框。返回值：点击确定，返回输入内容；点击取消，返回 null。语法： var one = prompt("请输入：")例子： var age = prompt("请输入年龄："); if(age < 18){ alert("您还未成年

2018-01-12 10:24:45 358

原创 Javascript 基础操作符

- Javascript 操作符分类 1. 算术操作符 2. 逻辑操作符 3. 赋值操作符 4. 比较操作符 5. 三元操作符（一）算术操作符加减乘除模：+，-，*，/，% 递增，递减：++，--（二）逻辑操作符与： &&说明（当操作数不全是Boolean类型时）：只要操作数中有一个是NaN（null,undefin

2018-01-11 11:53:09 185

原创 Javascript 基础 String 与 Boolean

String 类型String 类型用于表示由零或多个16位Unicode字符组成的字符序列即字符串。字符串可以由双引号或单引号表示。- toString() 与 String()强制转换语法：String(something)语法： str.toString()功能：将str 转换为字符串返回值：str的一个副本参数： str是要转换的内容，可以是数值、布尔值、对象、

2018-01-11 11:33:30 282

原创 Javascript 基础数值转换

有三个函数可以把非数值转换为数值：- Number()- parseInt()- parseFloat()说明：（1） Number() 是用来强制地把一个数值转换为数值类型，如果遇到转不了的，会返回NaN.（2）尽量使用：parseInt() 和 parseFloat()。参数为string.+ parseInt() : 忽略字符串前面的空格，直至找到第一个非空格字符

2018-01-11 11:10:53 195 1

原创 Javascript 基础数据类型

Javascript数据类型（ECMAScript）：- 基本数据类型：Undefined, Null, Boolean, Number, String- 复杂数据类型（ECMAScript6新增了symbol数据类型）：Object操作符： typeof。其功能为：检测变量类型。语法：typeof[空格]变量typeof(变量)返回值：string类型，值

2018-01-10 11:42:22 171

原创 Javascript 基础语法及变量

- Javascript 注释与分号- JS语法大小写敏感- 标识符- 变量- 变量的声明与赋值（1） Javascript 注释与分号// 单行注释/* */ 多行注释语句的结束使用分号，如果不加分号，则由解释器确定语句的结尾（2） JS语法大小写敏感JS对大小写敏感（3）标识符- 标识符：变量、函数、属性的名字，

2018-01-10 10:33:33 228

原创 Javascript 基础

Javascript 是一种基于对象和事件驱动的客户端脚本语言，最初的设计是为了检验HTML表单输入的正确性，起源与Netscape公司的LiveScript语言。现在，Javascript成为了一种复杂的编程语言，能够处理复杂的计算和交互。Javascript的组成：ECMAScript（语法）Browser Object ( DOM、BOM) （特性）其中，DOM

2018-01-10 09:55:31 148

原创 CSS 网页布局

一些布局：- 行布局- 多列布局- 圣杯布局- 双飞翼布局会使用到：HTML和CSS基础；会使用DIV + CSS进行排版；熟悉 Float属性、Position属性。（1）经典的行布局+ 基础的行布局+ 行布局自适应+ 行布局自适应限制最大宽+ 行布局垂直水平居中 .container{ width: 100%; max-w

2018-01-09 13:33:10 223

原创 CSS 定位

使用CSS定位，达到布局目的。- position 之static- position 之relative- position 之absolute- position 之fixed- position 之stickyposition 在CSS体系中，既是一个模块，也是一个属性。在CSS3 中一共有5中定位模型：

2018-01-08 18:31:02 285

原创 CSS float

float 属性有四个参数值：left，right，none，inherit。上述四个属性分别表示：左浮动，有浮动，无浮动，继承浮动。如果一个元素设置了float属性，则它自动变成了块级元素。它主要是用来设置图像的环绕方式的。CSS中有三种定位机制：- 标准流（普通流）- 定位- 浮动浮动使得元素脱离了标准流，用浮动的方式进行定位。然而，其他的元素也会相应地受到干扰，而

2018-01-08 11:49:58 401

原创 CSS 盒子模型

- 盒子模型概念- 高和宽设置- 边框设置- 内边距设置- 外边距设置- 盒子的计算- 元素显示方式（1）盒子模型概念盒子模型用来“放”网页中的各种元素内容，如文字、图片等，都可是盒子（DIV嵌套）（2）宽度设置width: 长度值 | 百分比 | auto最大宽度：max-width: 长度值 | 百分比 | aut

2018-01-05 11:18:40 216

原创 CSS 背景与列表

CSS 背景样式- background-color 设置元素的背景颜色- background-image 把图像设置为背景- background-position 设置背景图像的起始位置- background-attachment 背景图像是否固定或者随着页面的其余部分滚动- background-repeat 设置背景图片是否重复以及

2018-01-04 10:07:01 492

原创 CSS 文本样式

（1） text-align 属性 - 水平对齐方式语法： text-align:left 或 right 或 center 或 justify 注：该属性对块集元素设置有效，对行内元素设置无效！示例： .textalign{width:50%;margin:0 auto;}以上，设置文本的宽度，并居中显示文本（2）v

2018-01-03 17:34:29 855

原创 CSS 字体

- 文字颜色、字体大小、字体、加粗等- 文本行高、对齐方式、文本装饰文字样式属性：- 字体： font-family- 文字大小： font-size- 文字颜色：color- 文字粗细： font-weight- 文字样式： font-style(1) font-family 字体属性定义元素内文字以什么字体来显示语法：

2018-01-03 15:17:21 316

原创 CSS 样式命名规范

1. 采用英文字母、数字以及“-”和“_”命名2. 以小写字母开头，不能以数字和“-”、“_”开头3. 命名形式：一个单词，连字符，下划线和驼峰（除第一个字符外其他单词首字母大写）4. 使用有意义命名注意：- id谨慎使用- 适当使用class

2018-01-03 13:55:16 1811

原创 CSS 继承与层叠

CSS 继承即，从父元素那继承部分CSS属性好处：1. 父元素设置样式，子元素可以继承部分属性2. 减少CSS代码注意：当元素本身的样式与继承而来的样式有冲突时，将忽略继承来的样式，如下：- Chrom浏览器默认字体大小是16px- h1 默认字体大小font-size 是2em(正常字体的两倍)- 因此，在chrome中h1字体大小是32pxC

2018-01-03 13:38:35 430

原创 CSS 基础知识二选择器

选择器，就是CSS样式代码中，指定要调整样式的元素例如：p{color:red;} 中 p 就是选择器CSS选择器- 标签选择器- 类选择器- ID选择器- 全局选择器- 群组选择器- 后代选择器（1）标签选择器以HTML标签作为选择器：h1,h2{color:red;}（2）类选择器首先，需要为HTML标签添加class属

2018-01-02 20:56:28 348

原创 CSS 基础知识一

CSS 样式规则CSS样式规则由两部分构成：选择器，声明。选择器 ---> 指定哪个 html 元素进行样式设定声明 ------> 由属性和值构成

2018-01-02 16:02:47 196

CSS层叠样式表（Cascading Style Sheets）用于定义HTML内容在浏览器内的显示样式，目前使用的是CSS2/（PC端一些浏览器支持不够好）CSS3. 在手机端对CSS3比较好，因此在手机端一般都是使用html5+css3.- CSS简化HEML相关标签，使网页体积小，下载块- 解决内容与表现分离的问题- 更好地维护网页，提高工作效率要学习的：- CSS基础语法- CSS使用方法

2018-01-02 15:57:58 190

原创 HTML 第四篇

标签标签块级标签和行内标签标签嵌套规则由于，标签布局网页，不易维护与不够灵活。因此，目前网页布局基本使用的是：div + css.标签，是一个区块容器标记，之间是一个容器，可以包含段落、表格、图片等各种HTML元素。标签，没有实际意义，为了应用样式。块级标签：占据一行，换行（div,ul,ol,li,dl,dt,dd,h1-h6,p,form,

2018-01-01 21:28:31 202

purple_lumpy的博客