jQuery的context属性用法实例


Posted in Javascript onDecember 27, 2014

本文实例讲述了jQuery的context属性用法。分享给大家供大家参考。具体分析如下:

此属性可以返回传给jQuery()的原始DOM节点内容,即jQuery()方法的第二个参数值。
如果jQuery()方法没有指定此参数,那么context指向当前文档(document)。
语法结构:

$("selector").context

实例代码:

实例一:

<!DOCTYPE html>

<html>

<head>

<meta charset=" utf-8">

<meta name="author" content="https://3water.com/" />

<title>三水点靠木</title> 

<style type="text/css"> 

div 

{ 

  width:150px; 

  height:150px; 

  border:1px solid blue; 

} 

</style> 

<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script> 

<script type="text/javascript">  

$(document).ready(function(){ 

  $("button").click(function(){ 

    alert($("li").context); 

  })

})

</script>  

</head> 

<body> 

<div> 

  <ul> 

    <li>测试脚本</li> 

  </ul> 

</div> 

<button>点击测试</button> 

</body> 

</html>

默认状态下,传给jQuery()的原始DOM节点是Document,在IE浏览器下会返回[object],其他浏览器返回[object HTMLDocument]。
实例二:

<!DOCTYPE html>

<html>

<head>

<meta charset=" utf-8">

<meta name="author" content="https://3water.com/" />

<title>三水点靠木</title>

<style type="text/css">

div 

{

  width:150px;

  height:150px;

  border:1px solid blue;

}

</style>

<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>

<script type="text/javascript">  

$(document).ready(function(){ 

  $("button").click(function(){ 

    alert($("li",document.getElementById("myid")).context); 

  })

})

</script>

</head>

<body>

<div>

  <ul id="myid">

    <li>测试脚本</li>

  </ul>

</div>

<button>点击测试</button>

</body>

</html>

上述代码返回值是[object HTMLUListElement],但是在IE浏览器是[object]

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
增强的 JavaScript 的 trim 函数的代码
Aug 13 Javascript
File, FileReader 和 Ajax 文件上传实例分析(php)
Apr 27 Javascript
js防止表单重复提交的两种方法
Sep 30 Javascript
js和jquery如何获取图片真实的宽度和高度
Sep 28 Javascript
再分享70+免费的jquery 图片滑块效果插件和教程
Dec 15 Javascript
JavaScript+html5 canvas绘制渐变区域完整实例
Jan 26 Javascript
Google 地图类型详解及示例代码
Aug 06 Javascript
解决node.js安装包失败的几种方法
Sep 02 Javascript
微信小程序getPhoneNumber获取用户手机号
Sep 29 Javascript
代码详解JS操作剪贴板
Feb 11 Javascript
详解小程序如何避免多次点击,重复触发事件
Apr 08 Javascript
javascript实现倒计时关闭广告
Feb 09 Javascript
jQuery对象的selector属性用法实例
Dec 27 #Javascript
jQuery对象的length属性用法实例
Dec 27 #Javascript
jQuery中size()方法用法实例
Dec 27 #Javascript
jQuery中each()方法用法实例
Dec 27 #Javascript
jQuery.holdReady()方法用法实例
Dec 27 #Javascript
jQuery中的jQuery()方法用法分析
Dec 27 #Javascript
基于javascript实现的搜索时自动提示功能
Dec 26 #Javascript
You might like
PHP+DBM的同学录程序(1)
2006/10/09 PHP
PHP 字符截取 解决中文的截取问题,不用mb系列
2009/09/29 PHP
Godaddy空间Zend Optimizer升级方法
2010/05/10 PHP
php CI框架插入一条或多条sql记录示例
2014/07/29 PHP
PHP实现倒计时功能
2020/11/16 PHP
拖动Html元素集合 Drag and Drop any item
2006/12/22 Javascript
IE中jquery.form中ajax提交没反应解决方法分享
2012/09/11 Javascript
用javascript将数据导入Excel示例代码
2014/09/10 Javascript
js中confirm实现执行操作前弹出确认框的方法
2014/11/01 Javascript
详解XMLHttpRequest(一)同步请求和异步请求
2016/09/14 Javascript
AngularJS过滤器filter用法实例分析
2016/11/04 Javascript
jQuery Ajax全解析
2017/02/13 Javascript
vuex actions异步修改状态的实例详解
2019/11/06 Javascript
JS 获取文件后缀,判断文件类型(比如是否为图片格式)
2020/05/09 Javascript
浅谈Python 集合(set)类型的操作——并交差
2016/06/30 Python
Python实现mysql数据库更新表数据接口的功能
2017/11/19 Python
Python 25行代码实现的RSA算法详解
2018/04/10 Python
python 剪切移动文件的实现代码
2018/08/02 Python
详解Python中的正斜杠与反斜杠
2019/08/09 Python
PyQt5实现简单的计算器
2020/05/30 Python
css3过渡_动力节点Java学院整理
2017/07/11 HTML / CSS
adidas官方旗舰店:德国运动用品制造商
2017/11/25 全球购物
瑞典耳机品牌:URBANISTA
2019/12/03 全球购物
Servlet方面面试题
2016/09/28 面试题
自荐信格式的六要素
2013/09/21 职场文书
《美丽的小路》教学反思
2014/02/26 职场文书
初一新生军训方案
2014/05/22 职场文书
夫妻双方自愿离婚协议书
2014/10/24 职场文书
习近平在党的群众路线教育实践活动总结大会上的讲话全文
2014/10/25 职场文书
防卫过当辩护词
2015/05/21 职场文书
2015年教研室工作总结范文
2015/05/23 职场文书
Ajax实现局部刷新的方法实例
2021/03/31 Javascript
浅谈redis五大数据结构和使用场景
2021/04/12 Redis
使用CSS3实现按钮悬停闪烁动态特效代码
2021/08/30 HTML / CSS
总结高并发下Nginx性能如何优化
2021/11/01 Servers
js面向对象编程OOP及函数式编程FP区别
2022/07/07 Javascript