javascript学习笔记-2:jQuery中$("xx")返回值探究
最近在写一个jQuery插件的时候,需要用到一个条件:
一组img标签,每一个元素都需要被它前面的元素值src替换,如果是第一个(序列为0)则其值为最后一个元素值,如果是最后一个,那么其值为第一个元素值,以此形成一个闭环。
为此,我使用了三元运算符?:,其表达式为:var next=$(this).next()?$(this).next():imageItems.first();
运行测试发现如下问题,当运行到数组最后一个元素时,其next是始终不会是这一组img标签的第一个,为此对$(this).next()返回了什么进行了探究。
为简化起见,我在一个html页面上放置了一个p标签:
<!DOCTYPE Html>
<html>
<head>
<meta charset="utf-8">
<title>测试用例</title>
<link type="text/css" rel="stylesheet" href="../css/index.css">
</head>
<body> <p></p> <script src="../js/jquery-1.7.2.min.js"></script>
<script src="../js/carousel.js"></script>
<script>
$(function(){
var next=$('p').next('p')?10:50;
console.log(next) })
</script>
</body>
</html>
从理论上来说,因为只有一个p标签,那么是不存在next()的,在js中next的值应该是50才对,运行页面结果如图:
但显然,结果却不是这样,返回了10,表示$('p').next()返回的不是null或者未定义,那么这个到底返回了什么呢?修改代码,我把它打印了出来:
<script>
$(function(){
var next=$('p').next('p')?10:50;
console.log($('p').next('p')) })
</script>
从这里可以比较清楚地看到,即使使用next()是获取不到其他元素的,这个方法的返回值也不是null或者未定义,而是一个对象,这就表明$("xx")无论有没有xx这个元素,它
返回的都是一个包含一系列信息的js对象而不是null或者未定义。
因此如果希望用jquery选择器来作为boolean判断条件的,需要多一步,使用length属性或者get(0)等,如果length为0或者get(0)为undefined,那么说明你希望得到的元素不存在,反之存在。
javascript学习笔记-2:jQuery中$("xx")返回值探究的更多相关文章
- javascript 学习笔记之JQuery中的Deferred对象
Deffered是Jquery中的一个非常重要的对象,从1.5版本之后,Jquery中的ajax操作都基于Deffered进行了重构,这个对象的处理模式就像其他Javascript框中的Promise ...
- JavaScript学习笔记(四)——jQuery插件开发与发布
jQuery插件就是以jQuery库为基础衍生出来的库,jQuery插件的好处是封装功能,提高了代码的复用性,加快了开发速度,现在网络上开源的jQuery插件非常多,随着版本的不停迭代越来越稳定好用, ...
- Java程序猿的JavaScript学习笔记(9—— jQuery工具方法)
计划按例如以下顺序完毕这篇笔记: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScript ...
- Java程序猿的JavaScript学习笔记(8——jQuery选择器)
计划按例如以下顺序完毕这篇笔记: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScript ...
- Java程序猿JavaScript学习笔记(14——扩大jQuery UI)
计划和完成这个例子中,音符的顺序如下: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScr ...
- Java程序猿的JavaScript学习笔记(12——jQuery-扩展选择器)
计划按例如以下顺序完毕这篇笔记: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScript ...
- Java程序猿JavaScript学习笔记(4——关闭/getter/setter)
计划和完成这个例子中,音符的顺序如下: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScr ...
- jQuery 学习笔记:jQuery 代码结构
jQuery 学习笔记:jQuery 代码结构 这是我学习 jQuery 过程中整理的笔记,这一部分主要包括 jQuery 的代码最外层的结构,写出来整理自己的学习成果,有错误欢迎指出. jQuery ...
- 【学习笔记】jQuery的基础学习
[学习笔记]jQuery的基础学习 新建 模板 小书匠 什么是jQuery对象? jQuery 对象就是通过jQuery包装DOM对象后产生的对象.jQuery 对象是 jQuery 独有的. 如果 ...
随机推荐
- WebService中的WSDL详解 及jmeter测试
首先简单讲解一下什么是wsdl. 一个WSDL文档通常包含8个重要的元素,即definitions.types.import.message.portType.operation.bin ...
- word2vec原理(三) 基于Negative Sampling的模型
word2vec原理(一) CBOW与Skip-Gram模型基础 word2vec原理(二) 基于Hierarchical Softmax的模型 word2vec原理(三) 基于Negative Sa ...
- 38. leetcode 405. Convert a Number to Hexadecimal
405. Convert a Number to Hexadecimal Given an integer, write an algorithm to convert it to hexadecim ...
- .net Ajax使用
function CheckUsername() { var strName = $("#txtUserName").val(); $.ajax({ type: "GET ...
- (转载)Stackoverflow评选的C++推荐书单
C++必读书籍推荐 (原链接:http://bestcbooks.com/recommended-cpp-books 2013-10-07) 本文内容来自国外著名编程问答网站Stackoverflow ...
- vue的一些坑(第二天)
首先啊感谢一位小童鞋的指出其实我写的这些内容算不上坑,只是平时使用的时候的一点小问题,不过只是个名字啦!再次致谢 1:两个简写的命令 v-bind:class可以简写为 :class v-on:cl ...
- Win7 IIS建站
1.在控制面板->程序和功能->打开或关闭windows功能->安装IIS服务 2.控制面板->管理工具->IIS管理器 客户端访问Web服务器,服务器端不需关闭防火墙, ...
- php 下载文件
<?php header("Content-type:text/html;charset=utf-8"); // $file_name="cookie.jpg&qu ...
- pthread创建线程的简单演示
使用pthread创建子线程的简单步骤 导入头文件 #import <pthread.h> 指定新线程标识符 使用pthread创建线程的函数 根据result = 0 与否判断子线程 ...
- Ubuntu 如何安装Google Chrome浏览器
1.上Chrome 官网下载http://www.google.cn/chrome/browser/desktop/ 2.保存下载文件到Home路径下(个人习惯) 3.按Ctrl+Alt +T 调出终 ...