原生 JS 和 jQuery 检查某元素是否存在

对于动态生成内容的网页，常常遇到需要判断元素是否存在的场景。

1.原生 JS

1.1.问题描述

对于不存在的对象进行操作，会抛出错误。例如

document.getElementById(‘lzcBlog‘).innerText(‘The link of lzcBlog is www.lzcapp.cn‘);

其中，假如 ID 为 lzcBlog 的元素不存在，将会抛出一个错误：

document.getElementById(‘lzcBlog‘) is null, blablabla

1.2.解决方案

解决方案非常简单，通过判断该元素是否存在即可。

var lzcBlog = document.getElementById(‘lzcBlog‘);
if(lzcBlog)
{
    console.log(‘ID 为 lzcBlog 的元素存在于页面上。‘);
}
else
{
    console.log(‘ID 为 lzcBlog 的元素不存在。‘);
}

2.jQuery

2.1.问题描述

在 jQuery 中使用一个不存在的元素完全不会报错，请放心大胆使用。假如你仅仅是想检测元素是否存在，那你来对地方了。

2.2.解决方案

jQuery 对象的 length 属性可以帮助判断。当选择器传回的不是空元素时，其 length 属性不为 0。

var lzcBlog = $(‘#lzcBlog‘);
if(lzcBlog.length > 0)
{
    console.log(‘ID 为 lzcBlog 的元素存在于页面上。‘);
}
else
{
    console.log(‘ID 为 lzcBlog 的元素不存在。‘);
}

本文内容仅供个人学习、研究或参考使用，不构成任何形式的决策建议、专业指导或法律依据。未经授权，禁止任何单位或个人以商业售卖、虚假宣传、侵权传播等非学习研究目的使用本文内容。如需分享或转载，请保留原文来源信息，不得篡改、删减内容或侵犯相关权益。感谢您的理解与支持！

链接: https://shenqiku.cn/article/FLY_9615