网站前端开发-Jquery.pptVIP

网站前端开发 Jquery 网站制作的常识 网站制作最重要的是网页访问速度。影响网页访问速度除了服务器配置和网络硬件外，还有网页的容量。尽量多用客户端控件，少用服务器控件。 在网页制作时，可以加入一些脚本，使得网页具有更多的功能和特效。 脚本(script)由脚本语言编写，插入到html中即可，常用的脚本语言有javascript和vbscript。 JQuery简介 为了简化网页制作，一些程序员将常用的javascript代码封装在一起，构成一个个函数。JQuery就是javascript函数的集合。 JQuery是现阶段用得比较多的一个javascript库，是一个比较小的文件，下载下来即可使用,最新版可到下载。 JQuery的每个版本都有完整版和精简版，如jquery-1.31.js和jquery-1.31.min.js。前者主要用于学习和测试，后者主要用于项目开发。 DOM DOM=Document Object Model ,文档对象模型，所有支持javascript的浏览器都支持DOM. HTML中，DOM表现出来就是一棵树，称为DOM树，html为根结点，head和body为第一层子结点，以此类推。。 在页面中引入jquery 在网站根目录下新建一个文件夹，如jquery,将下载下来的jquery文件放到此文件夹下。如：\jquery\jquery-1.4.2.min.js 在head标签中引入jquery文件 $符号 在jquery库中，$就是jquery的简写。 $(“#jun”)和jquery(“#jun”)是等价的 一个网页就是一个document文档，任何脚本都需要document中的DOM树加载完成，才能执行。 一个简单的jquery程序 jquery选择器 基本选择器 层次选择器 过滤选择器 属性选择器 基本选择器：id选择器 body div id=“d1”第一块/div div id=“d2”第二块/div …… div id=“d8”第八块/div /body 基本选择器:元素选择器 body divDIV1/div divDIV2/div ppppp/p spanspan/span /body 基本选择器:类选择器 body div class=“one”第一块/div div class=“two”第二块/div span class=“three”span元素/span /body 层次选择器 $(“body input”)：选择网页中的所有input元素,而不管input处于DOM树中的哪一层。 $(“bodyinput”)：选择body元素的子input元素，只有第二层中的input才被选中。 $(“#in+div”)：选择id为in的元素的紧邻的下一个div元素。 $(“#in~div”)：选择id为in的元素之后的所有div元素 过滤选择器 属性选择器 * * html head body title table tr tr th th td td $(document).ready(function() { ……. }); 我们可以简化成： $(function() { …… }); 选中第二块: $(“#d2”) 选择所有的div块： $(“div”) 选择第二块: $(“.two”)