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 相关文章推荐
top.location.href 没有权限 解决方法
Aug 05 Javascript
extjs 的权限问题 要求控制的对象是 菜单,按钮,URL
Mar 09 Javascript
JavaScript中:表达式和语句的区别[译]
Sep 17 Javascript
js变量、作用域及内存详解
Sep 23 Javascript
基于jQuery实现搜索关键字自动匹配功能
Mar 26 Javascript
详解JavaScript的AngularJS框架中的表达式与指令
Mar 05 Javascript
基于javascript实现九九乘法表
Mar 27 Javascript
Javascript 调用 ActionScript 的简单方法
Sep 22 Javascript
js获取腾讯视频ID的方法
Oct 03 Javascript
Bootstrap输入框组件使用详解
Jun 09 Javascript
JavaScript实现的DOM绘制柱状图效果示例
Aug 08 Javascript
js实现鼠标拖拽缩放div实例代码
Mar 25 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
DC这些乐高系列动画电影你看过几部?
2020/04/09 欧美动漫
php学习之简单计算器实现代码
2011/06/09 PHP
用PHP提取中英文词语以及数字的首字母的方法介绍
2013/04/23 PHP
探讨Smarty中如何获取数组的长度以及smarty调用php函数的详解
2013/06/20 PHP
thinkphp在模型中自动完成session赋值示例代码
2014/09/09 PHP
基于Jquery 解决Ajax请求的页面 浏览器后退前进功能,页面刷新功能实效问题
2010/12/11 Javascript
IE中jquery.form中ajax提交没反应解决方法分享
2012/09/11 Javascript
将光标定位于输入框最右侧实现代码
2012/12/04 Javascript
用原生js做个简单的滑动效果的回到顶部
2014/10/15 Javascript
js简单的点击返回顶部效果实现方法
2015/04/10 Javascript
jQuery插件EnPlaceholder实现输入框提示文字
2015/06/05 Javascript
AngularJS整合Springmvc、Spring、Mybatis搭建开发环境
2016/02/25 Javascript
jQuery实现的网页换肤效果示例
2016/09/20 Javascript
使用Nodejs连接mongodb数据库的实现代码
2017/08/21 NodeJs
微信通过页面(H5)直接打开本地app的解决方法
2017/09/09 Javascript
微信小程序如何获取用户收货地址
2018/11/27 Javascript
Vue项目使用localStorage+Vuex保存用户登录信息
2019/05/27 Javascript
Layui数据表格判断编辑输入的值,是否为我需要的类型详解
2019/10/26 Javascript
python分析网页上所有超链接的方法
2015/05/08 Python
Python下载网络小说实例代码
2018/02/03 Python
python使用turtle绘制分形树
2018/06/22 Python
Pythony运维入门之Socket网络编程详解
2019/04/15 Python
python实现nao机器人身体躯干和腿部动作操作
2019/04/29 Python
详解基于python的多张不同宽高图片拼接成大图
2019/09/26 Python
Keras框架中的epoch、bacth、batch size、iteration使用介绍
2020/06/10 Python
解决python 执行shell命令无法获取返回值的问题
2020/12/05 Python
中专生毕业自我鉴定
2013/11/01 职场文书
应届生幼儿园求职信
2013/11/12 职场文书
“学雷锋活动月”总结
2014/03/09 职场文书
班级出游活动计划书
2014/08/15 职场文书
出国签证在职证明范本
2014/11/24 职场文书
小学语文复习计划
2015/01/19 职场文书
给客户的感谢信
2015/01/21 职场文书
导游词格式
2015/02/13 职场文书
python 安全地删除列表元素的方法
2022/03/16 Python
Go语言测试库testify使用学习
2022/07/23 Golang