brancepeng-CSDN博客

Ajax

1.什么是Ajax技术?这一技术能够想服务器请求额外数据而无需卸载页面.核心是XMLHttpRequest对象,简称XHR.可以通过XHR对象获得新数据,然后在通过DOM将新数据插入到页面中,Ajax通信与数据格式无关.2.XHR的用法>首先,调用open()方法:,接受三个参数:要发送的请求类型(get,post等),请求的URL和表示是否发送异步请求的布尔值.(只能在同一个...

2015-07-16 09:43:35 102

原创 javascript简介

1.JavaScript简介 JavaScript是一种基于对象和事件驱动(能随时响应键盘事件、鼠标事件及浏览器窗口事件等，并执行指定的操作。)，并具有安全性的脚本语言(JavaScript是客户端脚本，通过浏览器解释执行。它不允许访问本地的硬盘，不能将数据保存到服务器，不允许对网络文档进行修改和删除，只能通过浏览器实现信息浏览或动态交互，从而有效地防止数据的丢失。)。它与HTML,...

2015-07-14 10:41:28 151

原创 bootstrap的栅格系统实现原理

栅格系统的实现原理非常简单,仅仅是通过定义容器大小,平分成12份,在调整内外边距,最后结合媒体查询,就制作出强大的响应式栅格系统.栅格系统的主要实现原理:1.一行数据(row)必须包含在.container中,以便为其赋予合适的对其方式和内边距(padding).2.使用行(row)在水平方向创建一组列(column).3.具体内容应放置在列(column)内,而且只有列col...

2015-07-13 09:49:07 2324

原创 css定位(positioning)

CSS 定位 (Positioning) 属性允许你对元素进行定位。CSS 为定位和浮动提供了一些属性，利用这些属性，可以建立列式布局，将布局的一部分与另一部分重叠，还可以完成多年来通常需要使用多个表格才能完成的任务。定位的基本思想很简单，它允许你定义元素框相对于其正常位置应该出现的位置，或者相对于父元素、另一个元素甚至浏览器窗口本身的位置。显然，这个功能非常强大，也很让人吃惊。要知道，用...

2015-07-13 09:48:26 100

原创 css3 Media Query响应式媒体查询

在CSS中，有一个极其实用的功能：@media 响应式布局。具体来说，就是可以根据客户端的介质和屏幕大小，提供不同的样式表或者只展示样式表中的一部分。通过响应式布局，可以达到只使用单一文件提供多平台的兼容性，省去了诸如浏览器判断之类的代码。当然这种设计也存在着缺点，比如我所见的不少使用响应式布局的设计在适配移动端时大量使用 display:none 隐藏富媒体元素，这样势必会导致大量不必要...

2015-07-13 09:47:32 82

原创 HTML <!DOCTYPE> 标签的用法

定义和用法 <!DOCTYPE> 声明位于文档中的最前面的位置，处于 <html> 标签之前。此标签可告知浏览器文档使用哪种 HTML 或 XHTML 规范。该标签可声明三种 DTD 类型，分别表示严格版本、过渡版本以及基于框架的 HTML 文档。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Stri...

2015-07-13 09:47:06 85

原创这 30 类 CSS 选择器，你必须记在脑袋里！(一)

大概大家读知道`id`,`class`以及`descendant`选择器，并且整体都在使用它们，那么你正在错误拥有更大级别的灵活性的选择方式。这篇文章里面提到的大部分选择器都是在CSS3标准下的，所以它们只能在相应最新版本的浏览器中才能生效，你完全应该把这些都记在你聪明的脑袋里面。1. ** { margin: 0; padding: 0;}在我们看比...

2015-07-10 14:30:31 105

曾经，前端工程师经常会频繁的使用基于 table 的没有任何语义的布局。不过最终还是要感谢像 Jeffrey Zeldman 和 Eric Meyer 这样的思想革新者，聪明的前端工程师慢慢的接受了相对更语义化的 div 布局替代了 table 布局，并且开始调用外部样式表。但不幸的是，复杂的网页设计需要大量不同的标签结构代码，我们把它叫做 “div-soup” 综合症。也许你很熟悉下面的布局代...

2015-07-10 10:55:56 225

原创关于 HTTP meta 的 IE=edge 说明

HTTP meta 的 IE=edge 说明 7月18日杭州 OSC 源创会正在报名，送机械键盘和开源无码内裤陌生标记标记一： < meta http-equiv = "X-UA-Compatible" content = "IE=edge,chrome=1" />介绍:这是个是IE8的专用标记,...

2015-07-06 10:10:26 119

如何定义css优先级顺序

1.层叠选择器的优先级:浏览器缺省 <外部样式表 < 内部样式表 <内联样式其中,样式表优先级:类选择器 < 类派生选择器 < ID选择器 < ID派生选择器生选择器以前叫上下文选择器，所以完整的层叠优先级是:浏览器缺省 < 外部样式表 < 外部样式表类选择器 < 外部样式表类派生选择器 < 外部样式表ID选择器 &...

2015-05-20 15:28:15 166

为什么要用 Bootstrap

[Bootstrap](http://twitter.github.com/bootstrap/) 是由两个 twitter 员工开发并开源的前端框架，目前已经到了 2.0.4 的版本，在 [Github](https://github.com/twitter/bootstrap/) 上面有 32517个 watch，和 6608个 fork。非常火爆，而如此火爆自然有它的道理，在我们团队的所有...

2015-05-13 16:20:57 145

原创 media="screen"在代码里是什么意思，有何作用

2015-05-13 13:56:07 406

转载 meta name="viewport" content="width=device-width,initial-scale=1.0" 解释

2015-05-13 13:55:48 362

原创 CSS 框模型之padding

CSS 框模型 (Box Model) 规定了元素框处理元素内容(elment)、内边距(padding)、边框(border) 和外边距 (margin)的方式。元素框的最内部分是实际的内容，直接包围内容的是内边距。内边距呈现了元素的背景。内边距的边缘是边框。边框以外是外边距，外边距默认是透明的，因此不会遮挡其后的任何元素。在 CSS 中，width 和 height 指的是内容区...

2015-05-13 13:55:28 105

原创 css之关于user agent stylesheet

1.什么是user agent stylesheet?大家通常看到一个没有带任何CSS样式文件的HTML却带有不错的样式，这是由于在W3C的HTML标准里，一些HTML标签自带一些CSS样式。不同的浏览器把实现这些HTML自带样式的模块称作User Agent Stylesheet。不同的浏览器实现的User Agent Stylesheet不一，但大部分都能遵循W3C的标准。个人认...

2015-05-13 13:55:09 1642

a href=#与 a href=javascript:void(0) 的区别

a href="#"> 点击链接后，页面会向上滚到页首，# 默认锚点为 #TOP<a href="javascript:void(0)" onClick="window.open()"> 点击链接后，页面不动，只打开链接<a href="#" onclick="javascript:return false;"> 作用同上，不同浏

2015-04-10 11:34:04 95

“菜鸟”程序员和“大神”程序员差距在哪里

“菜鸟”和“大神”刚刚走出就业的程序员，技术是刚刚起步的基点。那下面我们就聊一聊有关技术的东西。首先请您先想想这几个问题。现在社会上有很多程序员，CSDN就是我们程序员的家，那您是否可想过程序员为什么会有不同的水平？你又是哪一类的程序员？“菜鸟”程序员和“大神”程序员差在哪里？真是差在技术上了吗？那不是差在技术上那差在了哪里？上面很多一连串的问题，没有把你搞晕吧！那就听我一一给您...

2015-04-10 10:35:50 164

js中call()方法

js callcall 方法请参阅应用于：Function 对象要求版本 5.5 调用一个对象的一个方法，以另一个对象替换当前对象。 call([thisObj[,arg1[, arg2[, [,.argN]]]]]) 参数 thisObj 可选项。将被用作当前对象的对象。 arg1, arg2, , argN 可选项。将被传递方法参数序列。说明 call 方法可以用来代替另一个对...

2015-04-08 15:33:21 103

原创 js引用类型之单体内置对象

ECMAScript-262对内置对象的定义:由ECMAScript提供的,不依赖于宿主环境的对象,这些对象在ECMAScript执行之前就已经存在了.内置对象有:Object,Array,String,Date等等...而单体内置对象在这里主要介绍Global和Math.1. 所有在全局作用域中定义的属性和方法,都是Global对象的属性和方法,诸如,isNaN(),parseInt()...

2015-04-01 11:37:02 87

原创 js引用类型变量之基本包装类型值String类型

1.String是字符串的对象包装类型,可以如下方式使用String构造函数来创建.var stringobject = new String("Hello,World !");其实,String类型提供了很多方法,用于辅助完成对ECMAScript中字符串的解析和操作.a.字符方法:charAt(),和charCodeAt(),二者均接受参数为字符串的某个字符下标.举个例子:...

2015-04-01 10:53:49 113

原创 js引用类型变量之Function类型(二)

函数的属性和方法:ECMAScript中的函数是对象,因此也有属性和方法,每个函数包含两个属性和方法:length和prototype.其中,length属性表示函数希望接受的参数的个数举个例子;function sayName(name){alert(name);} function sum (num1,num2){return num1+num2;} ...

2015-03-30 21:24:12 87

js引用类型变量之Function类型(一)

1.在ECMAScript中,函数被认为是对象,每个函数都是Function的实例,都具有属性和方法.因此,函数名实际上是一个指向函数对象的指针,不会与某个函数绑定.有两种定义方法:a.声明式:function sum (num1,num2){return num1+num2;}b.用函数表达式定义:var sum = function (num1,num2){return num1+...

2015-03-30 13:38:37 237

原创 js作用域

1.js的作用域是由函数划分的，而不是块儿 var too="test"; if(true){//这是在块中的定义，此时还是全局变量 var too="new test"; } alert(too=="new test");//return true; function te...

2015-03-30 09:13:00 64

原创 CSS绝对定位和浮动的区别和运用

一切皆为框div、h1 或 p 元素常常被称为块级元素。这意味着这些元素显示为一块内容，即“块框”。与之相反，span 和 strong 等元素称为“行内元素”，这是因为它们的内容显示在行中，即“行内框”。您可以使用 display 属性改变生成的框的类型。这意味着，通过将 display 属性设置为 block，可以让行内元素（比如 <a> 元素）表现得像块...

2015-03-30 09:12:08 627

原创 js中关于Date类型的算法和字符串之间的转换

1.将日期的字符串转化成毫秒数:var converted = Date.parse('2009/01/05'); console.log(converted); 1231084800000 var converted = Date.parse('2009-01-05'); console.log(converted); 12311136...

2015-03-30 09:11:34 64

原创 js引用类型变量之Array类型

提前注意:ECMAScript(即当前的js规范)中的数组和其他语言的数组有很大的不同.1.创建数组的方式,使用构造函数:var color = new Array();若提前知道数组的长度或者内容,则;var color = new Array(20);或者 var color = new Array('red','blue','grey');注意:也可以省略new关键字;var...

2015-03-27 16:06:38 135

js引用类型变量之Object类型

1.创建Object实例的方式有两种:一种是通过new Object(): var person = new Object(); person.name = "brancepeng"; person.age= 12; console.log(person ); //输出 Obje...

2015-03-27 11:19:47 205

内联元素与块级元素的区别

什么是块级元素和内联级元素关注前端 2010-09-14 23:27:11block（块）元素的特点：①总是在新行上开始；②高度，行高以及外边距和内边距都可控制；③宽度缺省是它的容器的100%，除非设定一个宽度。④它可以容纳内联元素和其他块元素 inline元素的特点：①和其他元素都在一行上；②高，行高及外边距和内边距不可改变；③宽度就是它的文字或图片的宽度，不可改变...

2015-03-24 14:35:55 94

原创 CSS-行内-内部-外部样式表

一 CSS（Cascading Style Sheets）级联样式表，作用：装饰HTML 二 CSS语法由三部分构成：选择器，属性，值。三 HTML引用CSS的三种方法（以下为示例代码） :分别为行内样式,内嵌式,和链接式.如下:p元素为行内样式,div元素为嵌入式(写在head元素内),另外一个为链接式:使页面框架html和css样式完全分离为两个或多个文件,是的前期制作和后期维护都很...

2015-03-24 10:15:45 255

原创 Shell脚本和shell

1.Shell Script，Shell脚本与Windows/Dos下的批处理相似，也就是用各类命令预先放入到一个文件中，方便一次性执行的一个程序文件，主要是方便管理员进行设置或者管理用的。但是它比Windows下的批处理更强大，比用其他编程程序编辑的程序效率更高，毕竟它使用了Linux/Unix下的命令。2.换一种说法也就是，shell script是利用shell的功能所写的一个程序，这个...

2015-03-10 09:28:44 79

原创理解Angularjs作用域$Scope

AngularJS中，子作用域一般都会通过JavaScript原型继承机制继承其父作用域的属性和方法。但有一个例外：在directive中使用scope: { ... }，这种方式创建的作用域是一个独立的"Isolate"作用域，它也有父作用域，但父作用域不在其原型链上，不会对父作用域进行原型继承。这种方式定义作用域通常用于构造可复用的directive组件。作用域的原型继承是非...

2015-03-09 15:32:40 166

原创内置对象

1.JavaScript单体内置对象:Object,Array,和String,Global,和Math.关于Global对象:所有在全局作用域中定义的函数和属性都是Global对象的属性.诸如,isNaN(),isFinite(),parseint()等都是它的方法,关于window对象:这里不做介绍.关于math 对象:详情见本地中web前端文件夹中的javaScript高级程序设

2015-03-03 09:57:39 163

原创 javascript中字符串的操作方法

1.concat()函数,用于讲一个或多个字符拼接起来,返回拼接得到的新的字符串.2.此外,ECMAScript还提供了三个基于子字符串创建新字符串的方法.slice(),substr()和substring().3.判断字符串位置的方法:indexOf(),lastIndexOf();4.trim()方法:创建一个字符串的副本,删除其前后的空格,放回结果.5,字符串大小写转换

2015-03-02 16:32:06 244

原创 Function函数对象

每个JavaScript函数都包含两个非继承而来的方法:apply()和caller().其中,apply方法接受两个参数,一个是在其中运行的函数作用域,另一个是参数组.或者可以是Array数组的实例,也可以是arguments对象.对于call(),第一个参数是this不变,而第二个传递的是直接的参数(即每个参数都必须例举出来).,当然,第二个参数也可以不传.

2015-03-02 09:37:10 199

原创关于ECMAScript的介绍

ECMAScript是一种由Ecma国际（前身为欧洲计算机制造商协会,英文名称是European Computer Manufacturers Assocication）通过ECMA-262标准化的脚本程序设计语言。这种语言在万维网上应用广泛，它往往被称为JavaScript或JScript，但实际上后两者是ECMA-262标准的实现和扩展。详情请参考: http://lzw.me

2015-02-26 10:11:14 249

brancepeng的专栏