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 相关文章推荐
Prototype ObjectRange对象学习
Jul 19 Javascript
js预载入和JavaScript Image()对象使用介绍
Aug 28 Javascript
Javacript实现颜色梯度变化和渐变的效果代码
May 31 Javascript
简要了解jQuery移动web开发的响应式布局设计
Dec 04 Javascript
jQuery实现弹幕效果
Feb 17 Javascript
js,jq,css多方面实现简易下拉菜单功能
May 13 Javascript
在vue项目中,使用axios跨域处理
Mar 07 Javascript
angular2/ionic2 实现搜索结果中的搜索关键字高亮的示例
Aug 17 Javascript
element-ui表格列金额显示两位小数的方法
Aug 24 Javascript
解决vue.js提交数组时出现数组下标的问题
Nov 05 Javascript
vue 动态设置img的src地址无效,npm run build 后找不到文件的解决
Jul 26 Javascript
详解JSON.parse和JSON.stringify用法
Feb 18 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对XML的操作详解
2013/06/07 PHP
Smarty中调用FCKeditor的方法
2014/10/27 PHP
php对象在内存中的存在形式分析
2015/02/03 PHP
PHP实现连接设备、通讯和发送命令的方法
2015/10/13 PHP
详解WordPress开发中过滤属性以及Sql语句的函数使用
2015/12/25 PHP
PHP面向对象程序设计之多态性的应用示例
2018/12/19 PHP
PhpStorm连接服务器并实现自动上传功能
2020/12/09 PHP
HTML-CSS群中单选引发的“事件”
2007/03/05 Javascript
javascript while语句和do while语句的区别分析
2007/12/08 Javascript
javascript 多浏览器 事件大全
2010/03/23 Javascript
网络图片延迟加载实现代码 超越jquery控件
2010/03/27 Javascript
js模仿windows桌面图标排列算法具体实现(附图)
2013/06/16 Javascript
js判断浏览器类型的方法
2013/08/07 Javascript
javascript转换静态图片,增加粒子动画效果
2015/05/28 Javascript
深入理解JavaScript的React框架的原理
2015/07/02 Javascript
学习vue.js条件渲染
2016/12/03 Javascript
如何提高Dom访问速度
2017/01/05 Javascript
webpack学习教程之前端性能优化总结
2017/12/05 Javascript
vue.js 获取select中的value实例
2018/03/01 Javascript
使用vue打包进行云服务器上传的问题
2020/03/02 Javascript
python动态性强类型用法实例
2015/05/09 Python
Python检测QQ在线状态的方法
2015/05/09 Python
python发送HTTP请求的方法小结
2015/07/08 Python
剖析Python的Tornado框架中session支持的实现代码
2015/08/21 Python
Python装饰器的执行过程实例分析
2018/06/04 Python
python生成ppt的方法
2018/06/07 Python
Python 变量的创建过程详解
2019/09/02 Python
django框架使用views.py的函数对表进行增删改查内容操作详解【models.py中表的创建、views.py中函数的使用,基于对象的跨表查询】
2019/12/12 Python
python实现录音功能(可随时停止录音)
2020/10/26 Python
Python脚本调试工具安装过程
2021/01/11 Python
Python使用tkinter制作在线翻译软件
2021/02/22 Python
法国家具及室内配件店:home24
2017/01/21 全球购物
J2EE面试题大全
2016/08/06 面试题
班级课外活动总结
2014/07/09 职场文书
2014年宣传部个人工作总结
2014/12/06 职场文书
幼儿园家长反馈意见
2015/06/03 职场文书