关于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 相关文章推荐
jQuery实现的类flash菜单效果代码
May 17 Javascript
jquery实现的可隐藏重现的靠边悬浮层实例代码
May 27 Javascript
如何设置iframe高度自适应在跨域情况下的可用方法
Sep 06 Javascript
jquery退出each循环的写法
Feb 26 Javascript
教你在heroku云平台上部署Node.js应用
Jul 30 Javascript
javascript数据结构与算法之检索算法
Apr 04 Javascript
js实现仿京东2级菜单效果(带延时功能)
Aug 27 Javascript
Canvas 绘制粒子动画背景
Feb 15 Javascript
jQuery树控件zTree使用方法详解(一)
Feb 28 Javascript
浅谈vue路径优化之resolve
Oct 13 Javascript
150行Node.js实现的dns代理工具
Aug 02 Javascript
jQuery高级编程之js对象、json与ajax用法实例分析
Nov 01 jQuery
一个简单的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 数组的指针操作实现代码
2011/02/08 PHP
Fedora下安装php Redis扩展笔记
2014/09/03 PHP
大家在抢红包,程序员在研究红包算法
2015/08/31 PHP
thinkphp3.x自定义Action、Model及View的简单实现方法
2016/05/19 PHP
php遍历、读取文件夹中图片并分页显示图片的方法
2016/11/15 PHP
php实现对文件压缩简单的方法
2019/09/29 PHP
JavaScript中的prototype原型学习指南
2016/05/09 Javascript
jQuery树控件zTree使用方法详解(一)
2017/02/28 Javascript
node文件上传功能简易实现代码
2017/06/16 Javascript
Vue上传组件vue Simple Uploader的用法示例
2017/08/25 Javascript
详解从新建vue项目到引入组件Element的方法
2017/08/29 Javascript
微信小程序之GET请求的实例详解
2017/09/29 Javascript
Vue开发实现吸顶效果的示例代码
2018/08/21 Javascript
js实现单元格拖拽效果
2020/02/10 Javascript
js实现百度淘宝搜索功能
2020/02/17 Javascript
django用户登录和注销的实现方法
2018/07/16 Python
在PyCharm下打包*.py程序成.exe的方法
2018/11/29 Python
Python3中的bytes和str类型详解
2019/05/02 Python
python opencv捕获摄像头并显示内容的实现
2019/07/11 Python
将Python文件打包成.EXE可执行文件的方法
2019/08/11 Python
pandas按行按列遍历Dataframe的几种方式
2019/10/23 Python
python中的逆序遍历实例
2019/12/25 Python
python 实现rolling和apply函数的向下取值操作
2020/06/08 Python
Django实现简单的分页功能
2021/02/22 Python
连卡佛中国官网:Lane Crawford中文站
2018/01/27 全球购物
大学生求职信范文应怎么写
2014/01/01 职场文书
优秀干部获奖感言
2014/01/31 职场文书
销售主管竞聘书
2014/03/31 职场文书
社区志愿者活动总结
2014/06/26 职场文书
大学生入党积极分子自我评价
2014/09/20 职场文书
小学语文教师研修日志
2015/11/13 职场文书
入党转正申请自我鉴定
2019/06/25 职场文书
学者《孟子》名人名言
2019/08/09 职场文书
解决hive中导入text文件遇到的坑
2021/04/07 Python
总结Python常用的魔法方法
2021/05/25 Python
Vue的生命周期一起来看看
2022/02/24 Vue.js