<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>链式操作风格</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
<style type="text/css">
#menu {
width:300px; }
.has_children{
background : #555;
color :#fff;
cursor:pointer; }
.highlight{
color : #fff;
background : green; }
div{ padding:0; }
div a{
background : #888;
display : none;
float:left; width:300px; }
</style>
<script src="jQuery/jquery-1.3.2.min.js" type="text/javascript"></script>
</head>
<body>
<div id="menu">
<div class="has_children">
<span>第一章-认识jQuery</span>
<a>1.1 JavaScript和JavaScript库</a>
<a>1.2 加入jQuery</a>
<a>1.3 简单编写jQuery代码</a>
<a>1.4 jQuery对象和DOM对象</a>
<a>1.5 解决jQuery和其他库的冲突</a>
</div>
<div class="has_children">
<span>第二章-jQuery选择器</span>
<a>1.1 JavaScript和JavaScript库</a>
<a>1.2 加入jQuery</a>
<a>1.3 简单编写jQuery代码</a>
<a>1.4 jQuery对象和DOM对象</a>
<a>1.5 解决jQuery和其他库的冲突</a>
</div>
<div class="has_children">
<span>第三章-jQuery中的DOM操作</span>
<a>1.1 JavaScript和JavaScript库</a>
<a>1.2 加入jQuery</a>
<a>1.3 简单编写jQuery代码</a>
<a>1.4 jQuery对象和DOM对象</a>
<a>1.5 解决jQuery和其他库的冲突</a>
</div>
</div>
</body>
<script type="text/javascript">
$(".has_children").click(function(){
$(this).addClass("highlight").children("a").show().end().siblings().removeClass("highlight")
.children("a").hide();
});
</script>
</html>
分享到：
相关推荐
### LINQ 风格的链式操作 jQuery 的设计受到了 .NET Framework 中 LINQ（Language Integrated Query）的影响，允许开发者以链式调用的方式来执行一系列操作。例如： ```javascript $("#element").addClass(...
3. **图片轮播**：为了实现图片的自动切换，你需要理解如何使用jQuery定时器（`.delay()`, `.setTimeout()`, `.setInterval()`）和链式操作。同时，需要掌握如何根据当前图片索引来调整百叶窗效果的方向和速度。 4....
个人觉得比较重要的有两点，一是对dom操作的链式调用，并且都呈队列状态，不仅仅使代码的可读语义变得通俗易懂，而且省去了对同一dom元素的多个链式操作时的回调中嵌回调的方式，这是很重要的一点。 二是对元素的...
此外，课件介绍了链式操作风格，这是jQuery中一个重要的特性，允许通过连接多个方法调用来编写紧凑的代码。例如，一个点击事件处理程序中可以连续调用addClass、next、show等方法来操作匹配的元素。 在讨论了jQuery...
在实践中，链式编程常见于DOM操作（如jQuery）、数据处理（如Lodash）和构建工具（如Gulp、Webpack）。例如，在jQuery中，我们可以编写如下代码： ```javascript $('div').addClass('highlight').css('color', 'red...
5. 链式操作：jQuery对象返回自身，允许连续调用多个方法，提高了代码的可读性和效率。 四、jQuery 1.2.6的函数详解 1. `$()`：这是jQuery的入口函数，用于选取DOM元素或创建新的jQuery对象。 2. `.each()`：遍历...
此外，还有链式调用，这是jQuery的一个强大特性，允许我们在单行代码中连续执行多个操作，如`$("#element").css("color", "red").fadeIn(500)`。 另外，事件处理是jQuery的另一个重要部分。jQuery提供了一致的接口...
4. 链式操作：jQuery的链式操作使得在同一个元素上执行多个操作变得简单。例如，可以同时添加事件监听、改变样式和更新内容。 5. 动态加载：为了优化性能，大范围的地区树可能采用懒加载策略，即只在用户需要时加载...
- **简化DOM操作**：jQuery提供了丰富的API用于简化DOM树的操作，使得开发者能够更加容易地添加、删除或修改页面元素。 - **跨浏览器兼容性**：通过内部封装对不同浏览器特性的处理逻辑，jQuery能够帮助解决浏览器间...
7. **链式操作**：jQuery的链式调用是其优雅代码风格的关键。实例中会展示如何通过单个jQuery对象连续调用多个方法，提高代码的可读性和效率。 8. **性能优化**：jQuery虽然便利，但也需要注意性能问题。例如，使用...
jQuery的核心特性包括选择器（用于快速定位DOM元素）、链式操作（方法调用可以连续进行）和封装好的AJAX功能。 **jPlayer插件**是jQuery的一个扩展，专注于多媒体播放。它提供了一套完整的解决方案，用于构建功能...
4. **链式操作**：jQuery支持链式调用，即在一个选择器上执行多个方法。这使得代码更简洁，如`$(selector).method1().method2()`。 5. **CSS和HTML结构**：为了实现这个功能，HTML需要构建一个清晰的导航菜单结构，...
jQuery还提供了一套连贯的链式API，允许开发者写出简洁且易于理解的代码。 **SimpleCalculadora插件特性** 1. **易用性**：jQuery SimpleCalculadora插件只需要少量的代码就可以设置一个计算器，极大地降低了开发...
2. **链式操作**：jQuery的链式操作使得代码更加简洁，例如`$("#hole").on("click", function() {...}).hide()`同时绑定了点击事件并隐藏元素。 3. **动画方法**：`.fadeIn()`, `.fadeOut()`, `.slideToggle()`等...
2. **链式操作**: jQuery对象返回的是jQuery实例，允许我们连续调用多个方法，如`$("#element").css("color", "red").fadeIn(500)`。 3. **DOM操作**: 可以方便地创建、插入、删除或修改DOM元素，如`$("<div>")....
2. **多步骤对话**：通过链式调用，可以创建多步骤的对话流程，用户按顺序完成每一步操作，提高交互流程的逻辑性。 3. **样式可定制**：内建多种预设样式，同时也允许开发者根据自己的需求自定义CSS样式，以适应...
EasyUI 基于 jQuery，利用其强大的选择器和链式调用来实现组件操作。 2. **UI 组件**: jQuery EasyUI 提供了诸如对话框（dialog）、表格（datagrid）、下拉框（combobox）、树形控件（tree）、菜单（menu）等常见的...
6. **链式操作**：jQuery支持链式调用，允许在一个选择器上连续执行多个操作，如`$("#element").css("color", "red").fadeIn(500)`，这使得代码更加简洁。 实现这个效果的基本步骤如下： 1. 包含jQuery库，确保...