jQuery 检查某个元素在页面上是否存在实例代码


Posted in Javascript onOctober 27, 2016

    最近做项目,有这么个功能用jQuery检查某个元素在网页上是否存在,这里记录下,也许能帮助正在读文章的朋友。

 用jQuery检查某个元素在网页上是否存在时,应该根据获取元素的长度来判断,代码如下:

if($("#tt").length > 0) {
  //元素存在时执行的代码
}

具体原因如下:

         在JavaScript中,我们在使用传统的getElementById()和getElementsByTagName()时,如果在网页中找不到相关元素,那么浏览器就会报错,影响后续代码的执行,所以为了避免浏览器报错,可以对元素进行判断,例如:

if(document.getElementById("tt")) {//js判断元素是否存在
  document.getElementById("tt").style.color = "red";
}

如果要操作的元素很多,就需要大量重复的工作,这往往让人厌倦。而jQuery的一大优势就是它完善的处理机制,即使用jQuery获取网页中不存在的元素也不会报错。这是因为$("#tt")获取的永远是对象,即使网页上没有此元素。因此当要用jQuery检查某个元素在网页上是否存在时,不能使用以下代码:

if($("#tt")) {
  //永远执行,不管元素是否存在
}

这就是为什么要根据元素的长度来判断元素在页面中是否存在的原因。

       感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!  

Javascript 相关文章推荐
学习从实践开始之jQuery插件开发 菜单插件开发
May 03 Javascript
jquery中通过父级查找进行定位示例
Jun 28 Javascript
jquery滚动组件(vticker.js)实现页面动态数据的滚动效果
Jul 03 Javascript
jQuery简易图片放大特效示例代码
Jun 09 Javascript
JS+CSS实现仿支付宝菜单选中效果代码
Sep 25 Javascript
谈谈JavaScript类型系统之Math
Jan 06 Javascript
值得分享的bootstrap table实例
Sep 22 Javascript
Vue.js常用指令的使用小结
Jun 23 Javascript
Vue.js 实现微信公众号菜单编辑器功能(二)
May 08 Javascript
jQuery发请求传输中文参数乱码问题的解决方案
May 22 jQuery
vue主动刷新页面及列表数据删除后的刷新实例
Sep 16 Javascript
React Fragment介绍与使用详解
Nov 11 Javascript
基于JS快速实现导航下拉菜单动画效果附源码下载
Oct 27 #Javascript
简单理解vue中el、template、replace元素
Oct 27 #Javascript
深入理解JavaScript定时机制
Oct 27 #Javascript
解析javascript图片懒加载与预加载的分析总结
Oct 27 #Javascript
js实现加载更多功能实例
Oct 27 #Javascript
Vue.js一个文件对应一个组件实践
Oct 27 #Javascript
JavaScript实现类似拉勾网的鼠标移入移出效果
Oct 27 #Javascript
You might like
php中文乱码怎么办如何让浏览器自动识别utf-8
2014/01/15 PHP
PHP类相关知识点实例总结
2016/09/28 PHP
Laravel5.4框架使用socialite实现github登录的方法
2019/03/20 PHP
javascript 获取表单file全路径
2009/12/31 Javascript
解决IE下select标签innerHTML插入option的BUG(兼容IE,FF,Opera,Chrome,Safari)
2010/05/13 Javascript
javascript 四则运算精度修正函数代码
2010/05/31 Javascript
zTree插件之单选下拉菜单实例代码
2013/11/07 Javascript
红米手机抢购的js代码
2014/03/10 Javascript
浅谈JavaScript字符串与数组
2015/06/03 Javascript
javascript实现数组中的内容随机输出
2015/08/11 Javascript
Angular.js与Bootstrap相结合实现手风琴菜单代码
2016/04/13 Javascript
利用BootStrap弹出二级对话框的简单实现方法
2016/09/21 Javascript
让编辑器支持word复制黏贴、截屏的js代码
2016/10/17 Javascript
浅谈jQuery中事情的动态绑定
2017/02/12 Javascript
详谈js遍历集合(Array,Map,Set)
2017/04/06 Javascript
vue使用vuex实现首页导航切换不同路由的方法
2019/05/08 Javascript
layui 数据表格+分页+搜索+checkbox+缓存选中项数据的方法
2019/09/21 Javascript
Vue 监听元素前后变化值实例
2020/07/29 Javascript
jquery实现抽奖功能
2020/10/22 jQuery
深入理解Django中内置的用户认证
2017/10/06 Python
安装完Python包然后找不到模块的解决步骤
2020/02/13 Python
Python3.7 读取音频根据文件名生成脚本的代码
2020/04/07 Python
python实现读取类别频数数据画水平条形图案例
2020/04/24 Python
html标签之Object和EMBED标签详解
2013/07/04 HTML / CSS
解决html5中的video标签ios系统中无法播放使用的问题
2020/08/10 HTML / CSS
麦当劳印度网上订餐:McDelivery
2020/03/16 全球购物
卫生巾广告词
2014/03/18 职场文书
营销部内勤岗位职责
2014/04/30 职场文书
公司合作协议范文
2014/10/01 职场文书
学生抄袭作业的检讨书
2014/10/02 职场文书
领导班子四风问题个人对照检查材料
2014/10/04 职场文书
高中生期中考试失利检讨书
2014/10/23 职场文书
师德承诺书
2015/01/20 职场文书
茶楼服务员岗位职责
2015/02/09 职场文书
MySQL时间设置注意事项的深入总结
2021/05/06 MySQL
Python字典和列表性能之间的比较
2021/06/07 Python