关于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插件简单实现代码
Apr 19 Javascript
js浮动图片的动态效果
Jul 10 Javascript
JavaScript function 的 length 属性使用介绍
Sep 15 Javascript
使用JavaScript 实现的人脸检测
Mar 24 Javascript
jQuery中extend函数详解
Jul 13 Javascript
javascript禁止超链接跳转的方法
Feb 02 Javascript
关于Vue单页面骨架屏实践记录
Dec 13 Javascript
微信小程序网络请求封装示例
Jul 24 Javascript
vue组件挂载到全局方法的示例代码
Aug 02 Javascript
element-ui表格列金额显示两位小数的方法
Aug 24 Javascript
extract-text-webpack-plugin用法详解
Feb 14 Javascript
Vue-resource安装过程及使用方法解析
Jul 21 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
上海地方志办公室-上海电子仪表工业志
2021/03/04 无线电
复杂检索数据并分页显示的处理方法
2006/10/09 PHP
php循环输出数据库内容的代码
2008/05/24 PHP
PHP+SQL 注入攻击的技术实现以及预防办法
2011/01/27 PHP
[对联广告] JS脚本类
2006/08/27 Javascript
JavaScript事件委托用法分析
2015/01/24 Javascript
js判断移动端是否安装某款app的多种方法
2015/12/18 Javascript
果断收藏9个Javascript代码高亮脚本
2016/01/06 Javascript
React Native仿美团下拉菜单的实例代码
2017/08/08 Javascript
ES6使用Set数据结构实现数组的交集、并集、差集功能示例
2017/10/31 Javascript
微信小程序实现图片预览功能
2018/01/31 Javascript
VUE DOM加载后执行自定义事件的方法
2018/09/07 Javascript
mpvue项目中使用第三方UI组件库的方法
2018/09/30 Javascript
微信小程序基于高德地图查找位置并显示文字
2019/10/30 Javascript
Python科学计算环境推荐——Anaconda
2014/06/30 Python
Python简单生成8位随机密码的方法
2017/05/24 Python
mac安装scrapy并创建项目的实例讲解
2018/06/13 Python
python实现两张图片的像素融合
2019/02/23 Python
Python中的十大图像处理工具(小结)
2019/06/10 Python
浅谈pandas.cut与pandas.qcut的使用方法及区别
2020/03/03 Python
如何使用PyCharm引入需要使用的包的方法
2020/09/22 Python
Python在后台自动解压各种压缩文件的实现方法
2020/11/10 Python
python 下载文件的多种方法汇总
2020/11/17 Python
美国婴儿和儿童家具网上商店:ABaby.com
2018/07/02 全球购物
英国地毯卖家:The Rug Seller
2019/07/18 全球购物
手术室护士自我鉴定
2013/10/14 职场文书
洗煤厂厂长岗位职责
2014/01/03 职场文书
研修第一天随笔感言
2014/02/15 职场文书
学生会竞选演讲稿怎么写
2014/08/26 职场文书
解除同居协议书
2015/01/29 职场文书
幼儿园中班教师个人总结
2015/02/05 职场文书
医学生自荐信范文
2015/03/05 职场文书
与死神共舞观后感
2015/06/15 职场文书
2015年秋季运动会广播稿
2015/08/19 职场文书
HR在给员工开具离职证明时,需要注意哪些问题?
2019/07/03 职场文书
中学生打架检讨书之500字
2019/08/06 职场文书