CSS+DIV+JQuery实际的视频汇总

在牛腩中学习过CSS和DIV。在JS中学习过CSS+JS 封装，在这里又回想了一遍，也作为查漏补缺，也算比較系统的复习了一遍吧。

css核心内容主要包含四个方面：标准流。盒子模型，浮动和定位，而在B/S前台页面的布局中，它们也起着决定性作用。盒子模型来确定每一个元素的详细大小。边框和间距等，浮动定位与标准流结合来确定页面中元素之间的排列顺序和位置布局等，再加上一些基础的CSS样式如背景图片，颜色等就能形成格式各样的web页面了。

DIV：CSS中定位技术的一种，作为一个单独的模块出现。与span相对。而CSS中定位还包含如position的relative和absolute方式。它们能够结合起来进行使用。使页面出现较为复杂的定位效果。

JS：为了使CSS所设计好的页面能够呈现出一个动态的效果，同一时候为了解决其它语言在client与server端之间交互的速度缓慢的问题，能够採用JavaScript技术，而JQuery则是一个兼容多种浏览器的一个经过封装好的轻量级的JS库。利用它，能够更加方便的对页面中的各种元素设计各种动态效果。

而这二者间有着不可切割的关系:细致分析发现，在JS设计动画效果时，很多看似非常复杂的效果。事实上都是通过设定页面元素的CSS样式来控制的。

比方图片的淡入淡出是通过opacity样式来控制的，而滚动，加速减速等这些动画效果也仅仅是通过一些如元素位置。大小等简单的CSS样式或者DOM元素属性加上一些简单的方法如setTimeout和setInterval等简单的函数封装而成的。

为了方便，相同JS中也提供了一些方法来设置或获取CSS样式。

css查漏补缺。过滤器：

Ie: opacity:filter(alpha=50);//w3c opacity:0.5
/*2、blur模糊*/
.blur{
	filter:progid:DXImageTransform.Microsoft.blur(pixelradius=4,makeshadow=false);
}
/*3透明色*/
	.chroma{
		filter:chroma(color=FF6800);		/* 去掉金黄色 */
	}
/*4、flip翻转*/
	.flip1{
		filter:fliph;	/* 水平翻转 */
	}
	.flip2{
		filter:flipv;	/* 竖直翻转 */
	}
	.flip3{
		filter:flipv fliph;	/* 水平、竖直同一时候翻转 */
	}
/*5、遮罩*/
	.mask{
		filter:mask(color=#8888FF);	/* 遮罩 */
	}
/*6、波浪*/
	span.wave1{
		filter:wave(add=0,freq=2,lightstrength=70,phase=75,strength=4);
	}

JS:李炎恢的视频中讲的挺全面的，针对于JQuery，视频中主要讲了有关于在实际应用中常常遇到的一些方法，在这里总结一下：

1.实现连缀：封装$()来返回一个JQuery对象。

这里理解的JQuery对象事实上和博客前端样例中的Base基础库核心对象一样。通过定一个一个构造函数对象，为这个对象的原型对象定义很多封装好的方法，以供外界进行调用。同一时候每次运行完毕后。返回这个对象本身，以便下一次继续实现连缀调用。这样大慷慨便了编程人员，这也充分体现了JQuery的write less,do more的设计理念。

2、经常用法：

1.获取和设置属性

html(),css(),val(),scrollLeft/Top(),height()/width(),outerWidth(true)/Height(true)

2.显示隐藏

hide()和show()，slideDown()和slideUp()，toggle()和slideToggle()，fadeOut()/fadeIn()//这里要注意參数的使用slow,fast,normal或者直接为数字

3.动画效果

animate(),dequeue()

4、其它

Is()方法，scroll(),appendTo(),插件的使用，浏览器版本号和类型的推断browser，JSON数据格式等等。

以上是关于JQuery视频中讲到的一些基础的知识概括。此外还包含一些基础的AJAX的封装函数如ajaxStart()和ajaxStop(),ajaxComplete(),$().get(),$().post（）等。

小结：CSS和JS二者的结合共同构成了现在站点中丰富多彩的web页面。基于JQuery是JS的一个封装库，当包，对于浏览器的差异，它应该在控制和尽量放弃的版本号控制的方式封装的能力来通过。同时，针对包装JS库，我们应该试着理解的原则包，然而，为了实现专有，知道为什么，为了创造我们自己的未来，JS库。