1、JQuery选择器继承了CSS、path语音的部分语法，允许通过标签名、属性名、内容对DOM元素进行快速、准确的选择。 2、JQuery选择器与JavaScript相比，具有代码简单、完善的检测机制的优势。 3、使用JQuery选择器实现隔行变色，示例代码如下： 代码如下: 使用JQuery实现隔行变色 body{font-size:12px;text-align:center} #tbStu{width:260px;border:solid 1px #666;background-color:#eee} #tbStu tr{line-height:23px} #...
一、官方网站下载：http://jquery.com 二、引入JQuery文件库 下载完后不用安装，只需将文件导入页面中即可，即在中加入如下代码： 三、编写一个弹出对话框的简单应用。 代码如下: New Document $(document).ready(function(){ //$是JQurey程序的标志 alert("您好，欢迎来到JQuery世界!");}) 效果图如： 四、JQuery基本结构为： 代码如下: $(document).ready(function(){ //程序段 }) 类似于JavaScript代码：wi...
1、功能需求：表格中数据隔行变色、删除数据、全选删除、鼠标移动到图片时显示图片预览 2、示例代码如下： 代码如下: 数据管理 body{font-size:12px} table{width:360px;border-collapse:collapse} table tr th,td{border:solid 1px #666;text-align:center} table tr td img{border:solid 1px #ccc;padding:3px;width:42px;height:60px;cursor:hand} table tr td span{float:left;padding-left:12px} table tr th{ba...
1、编写一个导航条，单击标题时，可以伸缩导航条内容，简化内容或显示更多内容。 示例代码如下： 代码如下: New Document body{font-size:13px} #divFrame{border:solid 1px #666;width:301px;overflow:hidden} #divFrame .clsHead{background-color:#eee;padding:8px;height:18px;cursor:hand} #divFrame .clsHead h3{padding:0px;margin:0px;float:left} #divFrame .clsHead span{float:right;margin-top:3px} #div...
1、在JQuery Mobile中，多个页面的切换是通过元素、并将属性设置为#+对应的id号的方式进行的。 2、多页面切换示例代码： 代码如下: New Document <script src="Js/jquery-1.8.3.min.js" type"text/javascript"></ script> JQuery Mobile 这是首页 详细页 3I工作室版权所有 JQuery Mobile 这里是详细页 返回首页 3I工作室版权所有 3、效果图预览：点击详细页将切换到另一页：4、除了内链接外，还有外链接，实现方...
1、内部链接是通过在标签内将href属性值设为#+id的形式，外链则是在中增加rel属性，并将属性值设为external，如：3i Studio 2、外部链接切换示例代码： 代码如下: New Document <script src="Js/jquery-1.8.3.min.js" type"text/javascript"></ script> 天气预报 今天| 明天 @2013 3i studio 今天天气 4~7'C晴转多云微风 3i Studio提供 @2013 3i studio 外部文件about.html代码: 代码如下: New Doc...
1、需要运行JQuery Mobile 移动应用页面，需要下载JQuery Mobile 3个相关插件文件（有多版本），jquery.mobile-1.2.0.min.css、jquery-1.8.3.min.js、jquery.mobile-1.2.0.min.js，JQuery Mobile官网地址：http://jquerymobile.com 2、将插件文件加载到页面中，注意它们的加载顺序，语句如： 代码如下: <script src="Js/jquery-1.8.3.min.js" type"text/javascript"></ script> 3、Hello World的示例代码如下： 代码如下: ...
1、bind()功能是为每个选择元素的事件绑定处理函数，其语法如下：bind(type, [data], fn) 其中type为一个或多个类型的字符串，如click或change，也可以自定义；可以被type调用的类型包括blur、focus、load、resize、scroll、unload、click、dbclick、mousedown等事件。参数data是作为event.data属性值传递对象的额外数据对象。参数fn是绑定到每个选择元素的事件中的处理函数。 2、示例代码： 代码如下: bind方法绑定事件 $(fu...
1、当用户浏览页面时，浏览器会对页面代码进行解释或编译——这个过程实质上是通过事件来驱动的，即页面在加载时，执行一个Load事件，在这个事件中实现浏览器编译页面代码的过程。事件被触发后被分为两个阶段，一个是捕获（Capture），另一个是冒泡(Bubbing)，但大多浏览器并不是都支持捕获阶段，因此事件被触发后，往往执行冒泡过程。 2、示例代码： 代码如下: 事件中的冒泡现象 $(function(){ var intI=0; $("body,div,#btn...
1、one()方法功能是为所选的元素绑定一个仅触发一次的处理函数，其调用的语法格式为：one(type, [data], fn) 其中参数type为事件类型，即需要触发什么类型的事件；参数data为可选参数，表示作为event.data属性值传递给事件对象的额外数据对象；fn为绑定事件时所要触发的函数。 2、示例代码： 代码如下: 其他事件 $(function(){ $("#button").bind("click",function(){ $("#button").attr("value","14797710665"); }); }) ...
1、通过映射的方式，给对象绑定多个事件。 2、示例代码： 代码如下: 映射方式绑定不同事件 $(function(){ $(".txt").bind({focus:function(){ $("#divTip").show().html("执行的是focus事件"); }, change:function(){ $("#divTip").show().html("执行的是change事件"); } }) }) 姓名： 3、效果图预览： 将光标置于文本框中点击显示效果如下：在文本框中输入内容然后将光标单击其他空白页面效果如下：JavaScript教程/参考...
1、在JQuery中，有两个方法用于事件的切换，一个方法是hover()，另一个是toggle()。所谓切换事件，即有两个以上的事件绑定于一个元素，在元素的行为动作间进行切换。如一个超级链接标记若想实现当鼠标悬停时触发一个事件，鼠标移出时又触发一个事件，可以用切换事件轻松实现。 2、示例代码： 代码如下: 切换事件hover $(function(){ $(".clsTitle").hover(function(){ $(".clsContent").show(); }, function(){ $(".clsConten...
1、在toggle()方法中，可以依次调用N个指定的函数，直到最后一个函数，然后重复对这个函数轮番调用，其语法如下：toggle(fn, fn2, [fn3, fn4,...])，其中fn、fn2、fn3、fn4等函数依次调用。 2、示例代码： 代码如下: toggle方法 body{font-size:13px} img{border:solid 1px #ccc;padding:3px} $(function(){ $("img").toggle(function(){ $("img").attr("src","Images/img05.jpg"); $("img").attr("title",this.src); },fun...
1、在DOM对象的实践操作中，既然存在用于绑定事件的bind方法，也相应存在用于移出绑定事件的方法，在JQuery中，可以通过unbind方法移除所有绑定的事件或某一个事件。 2、示例代码： 代码如下: unbind方法移除绑定事件 $(function(){ function oClick(){ //自定义事件 $("#divTip").append("这是按钮二绑定的事件"); }; $("input:eq(0)").bind("click",function(){ $("#divTip").append("这是按钮一绑定事件"); }); $("input:e...
1.Juqery是javascript的优秀框架。它是轻量级的js库，它兼容CSS3，还兼容各种浏览器（IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+），jQuery2.0及后续版本将不再支持IE6/7/8浏览器。jQuery使用户能更方便地处理HTML documents、events、实现动画效果，并且方便地为网站提供AJAX交互。jQuery还有一个比较大的优势是，它的文档说明很全，而且各种应用也说得很详细，同时还有许多成熟的插件可供选择。jQuery能够使用户的html页面保持代...