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 相关文章推荐
33个优秀的 jQuery 图片展示插件分享
Mar 14 Javascript
javascript中数组array及string的方法总结
Nov 28 Javascript
JQuery中Bind()事件用法分析
May 05 Javascript
理解JavaScript的变量的入门教程
Jul 07 Javascript
初识angular框架后的所思所想
Feb 19 Javascript
BootStrap Progressbar 实现大文件上传的进度条的实例代码
Jun 27 Javascript
使用gulp搭建本地服务器并实现模拟ajax
Apr 05 Javascript
基于JavaScript实现图片连播和联级菜单实例代码
Jul 28 Javascript
详解小程序原生使用ES7 async/await语法
Aug 06 Javascript
Angular使用ControlValueAccessor创建自定义表单控件
Mar 08 Javascript
微信小程序实现form表单本地储存数据
Jun 27 Javascript
如何在postman测试用例中实现断言过程解析
Jul 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
PHP4实际应用经验篇(4)
2006/10/09 PHP
php数组函数序列之each() - 获取数组当前内部指针所指向元素的键名和键值,并将指针移到下一位
2011/10/31 PHP
PHP 多维数组的排序问题 根据二维数组中某个项排序
2011/11/09 PHP
解析PHP 使用curl提交json格式数据
2013/06/29 PHP
PHP Session 变量的使用方法详解与实例代码
2013/09/11 PHP
PHP实现抓取Google IP并自动修改hosts文件
2015/02/12 PHP
Yii 2.0在Grid中格式化时间方法示例
2017/06/06 PHP
PHP CURL实现模拟登陆并上传文件操作示例
2020/01/02 PHP
使用POST方式弹出窗口的两种方法示例介绍
2014/01/29 Javascript
JSONP获取Twitter和Facebook文章数的具体步骤
2014/02/24 Javascript
深入理解javascript构造函数和原型对象
2014/09/23 Javascript
javascript实现依次输入input自动定焦
2014/12/23 Javascript
javascript判断数组内是否重复的方法
2015/04/21 Javascript
javascript实现自动填写表单实例简析
2015/12/02 Javascript
jQuery实现区域打印功能代码详解
2016/06/17 Javascript
用最简单的方法判断JavaScript中this的指向(推荐)
2017/09/04 Javascript
10 种最常见的 Javascript 错误(频率最高)
2018/02/08 Javascript
如何在vue中使用ts的示例代码
2018/02/28 Javascript
js+canvas实现验证码功能
2020/09/21 Javascript
Nuxt.js 静态资源和打包的操作
2020/11/06 Javascript
Python正则表达式使用经典实例
2016/06/21 Python
python 生成器生成杨辉三角的方法(必看)
2017/04/10 Python
tornado 多进程模式解析
2018/01/15 Python
在OpenCV里使用Camshift算法的实现
2019/11/22 Python
pytorch掉坑记录:model.eval的作用说明
2020/06/23 Python
python3判断IP地址的方法
2021/03/04 Python
HTML5 Canvas的性能提高技巧经验分享
2013/07/02 HTML / CSS
Currentbody法国:健康与美容高科技产品
2020/08/16 全球购物
shell程序中如何注释
2012/01/28 面试题
土地转让协议书
2014/09/27 职场文书
学年个人总结范文
2015/03/05 职场文书
2015年乡镇发展党员工作总结
2015/03/31 职场文书
2015年外联部工作总结
2015/04/03 职场文书
十七岁的单车观后感
2015/06/12 职场文书
六个好看实用的 HTML + CSS 后台登录入口页面
2022/04/28 HTML / CSS
JS实现页面炫酷的时钟特效示例
2022/08/14 Javascript