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 相关文章推荐
[原创]保存的js无法执行的解决办法
Feb 25 Javascript
javascript管中窥豹 形参与实参浅析
Dec 17 Javascript
jQuery插件zoom实现图片全屏放大弹出层特效
Apr 15 Javascript
javascript点击按钮实现隐藏显示切换效果
Feb 03 Javascript
深入理解JS继承和原型链的问题
Dec 17 Javascript
微信小程序 Tab页切换更新数据
Jan 05 Javascript
利用VUE框架,实现列表分页功能示例代码
Jan 12 Javascript
使用jquery给新生的th绑定hover事件的实例
Feb 10 Javascript
jQuery正则验证注册页面经典实例
Jun 10 jQuery
如何利用vue+vue-router+elementUI实现简易通讯录
May 13 Javascript
JS前后端实现身份证号验证代码解析
Jul 23 Javascript
JS实现百度搜索框
Feb 25 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
Protoss兵种对照表
2020/03/14 星际争霸
php垃圾代码优化操作代码
2010/08/05 PHP
PHP获取用户的浏览器与操作系统信息的代码
2012/09/04 PHP
图文详解phpstorm配置Xdebug进行调试PHP教程
2016/06/13 PHP
Yii隐藏URL中index.php的方法
2016/07/12 PHP
颜色选择器 Color Picker,IE,Firefox,Opera,Safar
2010/11/25 Javascript
jquery和ajax的关系详细介绍
2013/11/29 Javascript
jquery实现submit提交表单
2015/02/03 Javascript
javascript中call apply 与 bind方法详解
2016/03/10 Javascript
Angular.js如何从PHP读取后台数据
2016/03/24 Javascript
Angular.js 4.x中表单Template-Driven Forms详解
2017/04/25 Javascript
详解Node中导入模块require和import的区别
2017/08/11 Javascript
vue组件间通信子与父详解(二)
2017/11/07 Javascript
JS笛卡尔积算法与多重数组笛卡尔积实现方法示例
2017/12/01 Javascript
Node错误处理笔记之挖坑系列教程
2018/06/05 Javascript
vue视频播放插件vue-video-player的具体使用方法
2019/11/08 Javascript
[52:12]FNATIC vs Infamous 2019国际邀请赛小组赛 BO2 第一场 8.16
2019/08/19 DOTA
用Python的urllib库提交WEB表单
2009/02/24 Python
python基于windows平台锁定键盘输入的方法
2015/03/05 Python
Python tkinter事件高级用法实例
2018/01/31 Python
python暴力解压rar加密文件过程详解
2019/07/05 Python
使用OpenCV-python3实现滑动条更新图像的Canny边缘检测功能
2019/12/12 Python
Python datetime模块使用方法小结
2020/06/18 Python
LA MER海蓝之谜美国官网:传奇面霜
2016/08/27 全球购物
什么是makefile? 如何编写makefile?
2013/01/02 面试题
心得体会开头
2014/01/01 职场文书
三八妇女节活动主持词
2014/03/17 职场文书
篝火晚会主持词
2014/03/25 职场文书
邻里守望志愿服务活动方案
2014/08/15 职场文书
演讲稿的格式及范文
2014/08/22 职场文书
领导干部保密承诺书
2014/08/30 职场文书
银行求职信范文怎么写
2015/03/20 职场文书
2015年幼儿园中班工作总结
2015/04/25 职场文书
工作感言一句话
2015/08/01 职场文书
python3.7.2 tkinter entry框限定输入数字的操作
2021/05/22 Python
Flutter Navigator 实现路由传递参数
2022/04/22 Java/Android