关于jQuery判断元素是否存在的问题示例探讨


Posted in Javascript onJuly 21, 2014

是这样的,最近做jQuery训练时遇到jQuery判断元素是否存在时出现问题.

题目如下:请在"选择按钮3"后面,添加Id=rad4,处于选择状态的,之后文字为"选择按钮4"的HTML控件,只能添加一次(自由选择使用js原生或JQuery实现

function addradio() 
{ 
if (!document.getElementById("rad4")) 
{ 
var main = document.getElementById("radioContainer"); 

var input = document.createElement("input"); 
input.setAttribute("type", "radio"); 
input.setAttribute("id", "rad4"); 
var span = document.createElement("span"); 
var txt = document.createTextNode("选择按钮4"); 
span.appendChild(txt); 
main.appendChild(input); 
main.appendChild(span); 
} 
}

判断对象是否存在这样就够了。if (!document.getElementById("rad4"))但是jQuery中 if (!$("#rad4"))却是永假的的 楼楼以为 跟javascript一样事实并非如此

在jQuery中。一旦被$("")包装器 包装起来 就是一个对象 不是null或未定义 所以!$("#rad4")

永远是false 。正确做法如下

包装器中如果没有对象那么长度就为0;只需要这样就ok了

$(function () 
{ 

$(".domtree div:eq(6) input:eq(1)").click(function () 
{ 
if ($("#rad4").length < 1) 
{ 
$("<input type='radio' id='rad4'> <span>选择按钮4</span>").appendTo($("#radioContainer")); 
} 
} 
) 

} 
)
Javascript 相关文章推荐
禁止F5等快捷键的JS代码
Mar 06 Javascript
JAVASCRIPT下判断IE与FF的比较简单的方式
Oct 17 Javascript
(function($){...})(jQuery)的意思
Jul 22 Javascript
Extjs中TabPane如何嵌套在其他网页中实现思路及代码
Jan 27 Javascript
JavaScript中的6种运算符总结
Oct 16 Javascript
angular route中使用resolve在uglify压缩后问题解决
Sep 21 Javascript
vue.js中过滤器的使用教程
Jun 08 Javascript
React中jquery引用的实现方法
Sep 12 jQuery
vue mint-ui tabbar变组件使用
May 04 Javascript
解决angularJS中input标签的ng-change事件无效问题
Sep 13 Javascript
javascript实现切割轮播效果
Nov 28 Javascript
ES6学习笔记之字符串、数组、对象、函数新增知识点实例分析
Jan 22 Javascript
一个简单的jQuery计算器实现了连续计算功能
Jul 21 #Javascript
JavaScript访问CSS属性的几种方式介绍
Jul 21 #Javascript
javascript实现的元素拖动函数宿主为浏览器
Jul 21 #Javascript
javascript定义变量时有var和没有var的区别探讨
Jul 21 #Javascript
JQuery中$(document)是什么意思有什么作用
Jul 21 #Javascript
jquery显示隐藏input对象
Jul 21 #Javascript
jquery实现保存已选用户
Jul 21 #Javascript
You might like
Php获取金书网的书名的实现代码
2010/06/11 PHP
PHP学习笔记 用户注册模块用户类以及验证码类
2011/09/20 PHP
PHP中mb_convert_encoding与iconv函数的深入解析
2013/06/21 PHP
解析php下载远程图片函数 可伪造来路
2013/06/25 PHP
PHP的Yii框架中行为的定义与绑定方法讲解
2016/03/18 PHP
php中输出json对象的值(实现方法)
2018/03/07 PHP
PHP中abstract(抽象)、final(最终)和static(静态)原理与用法详解
2020/06/05 PHP
a标签的css样式四个状态
2021/03/09 HTML / CSS
javascript 支持ie和firefox杰奇翻页函数
2008/07/22 Javascript
JavaScript中出现乱码的处理心得
2009/12/24 Javascript
Javascript 中的类和闭包
2010/01/08 Javascript
菜鸟javascript基础资料整理2
2010/12/06 Javascript
ajax中get和post的说明及使用与区别
2012/12/23 Javascript
wap手机图片滑动切换特效无css3元素js脚本编写
2014/07/28 Javascript
jQuery实现表格颜色交替显示的方法
2015/03/09 Javascript
JavaScript通过代码调用Flash显示的方法
2016/02/02 Javascript
JavaScript编写一个简易购物车功能
2016/09/17 Javascript
JavaScript实现Java中Map容器的方法
2016/10/09 Javascript
Node接收电子邮件的实例代码
2017/07/21 Javascript
vue mint-ui tabbar变组件使用
2018/05/04 Javascript
Three.js中矩阵和向量的使用教程
2019/03/19 Javascript
浅谈bootstrap layer.open中end的使用方法
2019/09/12 Javascript
Python中输出ASCII大文字、艺术字、字符字小技巧
2015/04/28 Python
python使用socket连接远程服务器的方法
2015/04/29 Python
python中黄金分割法实现方法
2015/05/06 Python
深入理解Python对Json的解析
2017/02/14 Python
python 删除指定时间间隔之前的文件实例
2018/04/24 Python
详解django中使用定时任务的方法
2018/09/27 Python
python处理document文档保留原样式
2019/09/23 Python
python中函数返回多个结果的实例方法
2020/12/16 Python
美国单身专业人士在线约会网站:EliteSingles
2019/03/19 全球购物
新闻发布会活动策划方案
2014/09/15 职场文书
弘扬焦裕禄精神践行三严三实心得体会
2014/10/13 职场文书
2016小学新学期寄语
2015/12/04 职场文书
纯html+css实现打字效果
2021/08/02 HTML / CSS
详细介绍Next.js脚手架完整搭建封装
2022/04/26 Javascript