<%@ page language="java" pageEncoding="GBK"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>JQuery测试页面2</title>
<script type="text/javascript" src="js/jquery-1.4.3.js"></script>
<style type="text/css">
.pp{
color:red;
background-color:orange;
}
.pp2{
color:blue;
background-color:red;
}
img{
width:100px;
height:50px;
}
</style>
<script type="text/javascript">
//DOM加载完成后执行的函数，相当于$(document).ready()的简写
$(function(){
//改变网页title
$("document").context.title = "欢迎来到jquery的测试世界！！";
});
function eachTest()
{
alert("P的个数：" + $("p").size() + "，用size()获取");
alert("P的个数：" + $("p").length + "，用length获取");
alert("P的选择器：" + $("p").selector);
$("p").each(function(i){
$(this).text("这是：" + $(this).text());
if(i%2==0)
{
$(this).addClass("pp");
}
else
{
$(this).addClass("pp2");
}
});
//返回传给jQuery()的原始的DOM节点内容，即jQuery()的第二个参数。
//如果没有指定，那么context指向当前的文档(document)。
//输出结果 INPUT
alert($("#myText",document.getElementById("myText")).context.nodeName);
}
function getTest()
{
//$("img").get()获取网页上的img对象的DOM集合
//不是jquery对象集合
//alert结果是http://localhost:8099/Test/img/a.jpg
alert("翻转前第零个：" + $("img").get()[0].src);
//集合内容翻转
var arr = $("img").get().reverse();
//alert结果是http://localhost:8099/Test/img/b.jpg
alert("翻转后第零个：" + arr[0].src);
//获取网页中第一P的文本值
alert($("p").get(0).innerText);
}
function dataTest()
{
alert("添加之前：" + $("div").data("test"));
//给div加一个缓存数据
$("div").data("test","data函数测试");
alert("添加之后：" + $("div").data("test"));
}
</script>
</head>
<body>
<input type="button" value="each函数测试" onclick="eachTest();"/>
<p>一</p>
<p>二</p>
<p>三</p>
<p>四</p>
<p>五</p>
<p>六</p>
<p>七</p>
<p>八</p><br/>
<input type="text" id="myText" name="myText" value="111"/><br/><br/>
<input type="button" value="get函数测试之图像翻转" onclick="getTest();"><br/><br/>
<img src="img/a.jpg"/> <img src="img/b.jpg"/>
<br/><br/>
<input type="button" value="data函数测试" onclick="dataTest();"><br/><br/>
<div>data函数测试</div>
</body>
</html>
分享到：
相关推荐
《jQuery功能测试源码解析与实战应用》 jQuery，这个小巧而强大的JavaScript库，自2006年发布以来，就以其简洁的API和强大的功能深受开发者喜爱。它极大地简化了DOM操作、事件处理、动画效果以及Ajax交互，使得前端...
**JS框架JQuery初步测试** JQuery是一款广泛应用于前端开发的JavaScript库，它极大地简化了JavaScript的DOM操作、事件处理、动画制作以及Ajax交互。在本文中，我们将深入探讨JQuery的基本概念、核心功能和常见用法...
这个压缩包文件“jquery1.2.6-1.7.1测试所需”包含了从版本1.2.6到1.7.1的jQuery库，这是一系列非常重要的版本，因为它们见证了jQuery的快速发展和功能完善。 1. **jQuery 1.2.6**：这是jQuery早期的一个稳定版本，...
三、jQuery测试实践 1. 单元测试：对于功能测试源码，我们可以使用JUnit、QUnit等单元测试框架，对jQuery的各个函数进行测试，确保它们按照预期工作。 2. 性能测试：通过模拟大量DOM操作和事件处理，评估jQuery在...
更详细"超炫jQuery测试答题功能”特效教程，http://www.sucaihuo.com/js/39.html。你也可以在素材火网页特效下载 http://www.sucaihuo.com/js，都是优质素材，最主要是既有教程，也有演示并且可下载哦，技术大咖也来...
本示例"Jquery跨域Ajax请求测试"将详细讲解如何利用jQuery实现这一功能。 首先，了解同源策略是理解跨域问题的关键。同源策略是浏览器为了保障用户安全而设定的一项机制，它规定了只有来自同一协议、同一域名和同一...
**jQuery功能测试源码详解** jQuery是一个广泛应用于前端开发的JavaScript库，以其简洁的API和强大的功能著称。本测试源码旨在展示jQuery的核心功能，包括元素选择、事件处理、DOM操作以及动画效果等，帮助开发者更...
这个“JQuery选择器测试 离线版”是一个专门用于检验和学习jQuery选择器功能的应用，由一位国外专家创建，并进行了轻微的修改。** 在jQuery中，选择器分为多种类型，包括基础选择器、类别选择器、ID选择器、属性...
本篇将基于提供的"jQuery 测试题目 以及参考答案"来深入探讨jQuery的相关知识点。** 1. **jQuery选择器** - **基本选择器**：如 `$("#id")` 选择ID为指定ID的元素，`$(".class")` 选择具有指定类名的元素，`$("tag...
**jQuery实现的网页小游戏详解** 在网页开发领域，jQuery是一个非常流行和强大的JavaScript库，它极大地简化了DOM操作、事件处理、动画制作等任务。本篇文章将深入探讨如何利用jQuery来实现一系列有趣的网页小游戏...
我们可以使用jQuery的插件模式，将游戏的不同部分（如击球逻辑、碰撞检测、计分系统等）封装成独立的模块，便于管理和测试。 总的来说，利用jQuery实现台球小游戏是一个综合运用JavaScript、物理学、UI设计等多个...
【jQuery腾讯肌肤缺水指数测试】是一个基于jQuery技术开发的应用，旨在帮助用户了解自己的肌肤水分状况，通过互动式的测试提供个性化的护肤建议。这个项目利用了jQuery的强大功能，结合前端界面设计，为用户提供了一...
在"jquery ajax json struts2最简单例子测试成功"的项目中，我们可以推断出以下几个关键点： 1. **整合jQuery与AJAX**：项目中可能使用jQuery的$.ajax()方法来发送异步请求。$.ajax()提供了一种方式，通过HTTP GET...
其中，jQuery 的一个流行插件——ThickBox，就是一个用于创建全屏弹出效果的工具，尤其适合展示图片、视频或者任何网页内容。ThickBox 结合了 jQuery 的简洁性和强大的功能，使得在网页中实现 div 弹出效果变得非常...
JQuery2.1.0的jar包已经有了，上传不了，就上传了一个测试的静态页面
北大青鸟内部测试笔试题1北大青鸟内部测试笔试题1北大青鸟内部测试笔试题1
【jQuery功能测试源码_aspx开发教程】 在Web开发领域，jQuery是一个广泛使用的JavaScript库，它极大地简化了HTML文档遍历、事件处理、动画以及Ajax交互。本教程将重点介绍如何利用jQuery在ASP.NET（ASPX）环境中...
**jQuery Easy UI 模板详解** jQuery Easy UI 是一个基于 jQuery 的前端开发框架，它提供了一系列的组件和样式，使得开发者能够快速构建出美观且功能丰富的 Web 应用程序。这个压缩包包含的 "jQuery Easy UI 学习...