JavaScript - 测试 jQuery
测试 JavaScript 框架库 - jQuery
引用 jQuery
如需测试 JavaScript 库,您需要在网页中引用它。
为了引用某个库,请使用 <script> 标签,其 src 属性设置为库的 URL:
引用 jQuery
<html>
<head>
<script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js">
</script>
</head>
<body>
</body>
</html>
jQuery 描述
主要的 jQuery 函数是 $() 函数(jQuery 函数)。如果您向该函数传递 DOM 对象,它会返回 jQuery 对象,带有向其添加的 jQuery 功能。
jQuery 允许您通过 CSS 选择器来选取元素。
在 JavaScript 中,您可以分配一个函数以处理窗口加载事件:
JavaScript 方式:
{
var obj=document.getElementById("h01");
obj.innerHTML="Hello jQuery";
}
onload=myFunction;
等价的 jQuery 是不同的:
jQuery 方式:
{
$("#h01").html("Hello jQuery");
}
$(document).ready(myFunction);
上面代码的最后一行,HTML DOM 文档对象被传递到 jQuery :$(document)。
当您向 jQuery 传递 DOM 对象时,jQuery 会返回以 HTML DOM 对象包装的 jQuery 对象。
jQuery 函数会返回新的 jQuery 对象,其中的 ready() 是一个方法。
由于在 JavaScript 中函数就是变量,因此可以把 myFunction 作为变量传递给 jQuery 的 ready 方法。
jQuery 返回 jQuery 对象,与已传递的 DOM 对象不同。 jQuery 对象拥有的属性和方法,与 DOM 对象的不同。 您不能在 jQuery 对象上使用 HTML DOM 的属性和方法。 |
测试 jQuery
请试一下下面这个例子:
实例
<html>
<head>
<script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js">
</script>
<script>
function myFunction()
{
$("#h01").html("Hello jQuery")
}
$(document).ready(myFunction);
</script>
</head>
<body>
<h1 id="h01"></h1>
</body>
</html>
请再试一下这个例子:
实例
<html>
<head>
<script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js">
</script>
<script>
function myFunction()
{
$("#h01").attr("style","color:red").html("Hello jQuery")
}
$(document).ready(myFunction);
</script>
</head>
<body>
<h1 id="h01"></h1>
</body>
</html>
正如您在上面的例子中看到的,jQuery 允许链接(链式语法)。
链接(Chaining)是一种在同一对象上执行多个任务的便捷方法。
需要学习更多内容吗?W3School 为您提供了非常棒的 jQuery 教程。
JavaScript - 测试 jQuery的更多相关文章
- JavaScript测试工具
大家都知道Javascript的测试比较麻烦,一般是开发使用一些浏览器的插件比如IE develop bar或是firebug来调试,而测试往往需要通过页面展示后的js错误提示来定位.那么还有其他比较 ...
- 表单美化-原生javascript和jQuery单选按钮(兼容IE6)
最近很多人问怎么美化表单的元素,大家都知道表单元素在各个浏览器中的表现不一,反正也是特别的丑,那么问题就来了,我们能自己设计表单元素的外观么?答案是可以的,现在我们就来试试吧.我们用两种方式来实现这一 ...
- JavaScript、jQuery、HTML5、Node.js实例大全-读书笔记1
技术很多,例子很多,只好慢慢学,慢慢实践!!现在学的这本书是[JavaScript实战----JavaScript.jQuery.HTML5.Node.js实例大全] 第 3 章 用 JavaScri ...
- [转载]javascript+ajax+jquery教程11--正则表达式
原文地址:javascript+ajax+jquery教程11--正则表达式作者:morflame 正则表达式可以: 测试字符串的某个模式.例如,可以对一个输入字符串进行测试,看在该字符串是否存在一个 ...
- JavaScript - 库 jQuery
测试 JavaScript 框架库 - jQuery 引用JQuery 如需测试JavaScript库,您需要在网页中引用它. 为了引用某个库,请使用<script>标签,其src属性设置 ...
- jQuery学习之路(7)- 用原生JavaScript实现jQuery的某些简单功能
▓▓▓▓▓▓ 大致介绍 学习了妙味,用原生的JavaScript实现jQuery中的某些部分功能 定义自己的函数库lQuery ▓▓▓▓▓▓ $()选择器的实现 jQuery是面向对象的,所以自己编写 ...
- Error: Bootstrap's JavaScript requires jQuery错误
引入bootstrap时会出现的问题:boostrap下拉菜单无效,浏览器报Uncaught Error: Bootstrap's JavaScript requires jQuery错误, 解决办法 ...
- 【JavaScript与JQuery获取H2的内容】
撰写日期:2016-7-13 11:05:07 JavaScript与JQuery获取DOM内容是有区别的,接下来看一例子 栗子: Jquery-获取H3中的内容然后Dom转换为Jquery < ...
- Jquery 复习练习(02)Javascript 与jquery 互转 onclick 与click区别
Javascript 与jquery 互转 jquery 为<script src="jquery-1.8.3.js"></script> 以checkbo ...
随机推荐
- 修改表增加字段默认值default
对个生产库的表增加1个字段.字段类型是INT型, 表数据有2千万条, alter table table_name add xxoo number(4) default 0 ; 因此 不仅要修改字典 ...
- 14.6.11 Configuring Optimizer Statistics for InnoDB 配置优化统计信息用于InnoDB
14.6.11 Configuring Optimizer Statistics for InnoDB 配置优化统计信息用于InnoDB 14.6.11.1 Configuring Persisten ...
- 【HDOJ】1728 逃离迷宫
题目大坑,注意行列顺序式反的,另外注意起点和终点相同. #include <iostream> #include <cstdio> #include <cstring&g ...
- swiper去除滑动设置
有时候使用swiper并不想让它滑动,怎么设置呢? 1.noSwiping设为true 2.在slide上(或其他元素)增加类名'swiper-no-swiping',使该slide无法拖动. 案例: ...
- WordPress HMS Testimonials 多个跨站脚本漏洞和跨站请求伪造漏洞
漏洞名称: WordPress HMS Testimonials 多个跨站脚本漏洞和跨站请求伪造漏洞 CNNVD编号: CNNVD-201308-199 发布时间: 2013-08-22 更新时间: ...
- -_-#flash播放器自适应
设置断点,几个断点下的固定布局
- (转载)不能启动虚拟机 Unable to open kernel device "\\.\Global\vmx86
(转载)http://blog.csdn.net/shenghuiping2001/article/details/7083153 今天系统加了内存条,设置变了一下: 就启动不起虚拟机了,报错: Un ...
- 窥探Unity5渲染内部之解析UnityShaderVariables.cginc
unity5的UnityShaderVariables.cginc比unity4大了1kb这里装着unity shader 大部分内部参数,写这个方便以后自己查询 Camera参数 uniform f ...
- 关于View和VIewController的关系和理解
之前看过关老师的视频之后就有写关于视图切换的程序,不过那是很久之前了,那时候也不知道什么是View,什么是VIewController,就知道照着写.这次项目的时候,我又碰到了这个问题,我自以为比较能 ...
- [git] git 的基本认知
版本管理 ( Version Control ) 版本管理系统是一个记录文件变更的系统,让你在一段时间后可以恢复指定版本的文件.版本管理系统大致可分为三类:独立的本地版本管理系统.中心化版本管理系统. ...