前端的JS脚本的运行,大多离不开DIV元素,比如在网页的某个区域显示一些内容或改变一些DIV元素的背景颜色等等,但如果在操作DIV时,不确定指定的DIV元素是否存在怎么办?那么飞鸟慕鱼博客的小编就给大家说一说,在js中如何判断一个div元素是否存在。

js 判断某个元素在页面上是否存在的方法

jquery 判断DIV元素是否存在

示例代码:

<script>
    if($('#div').length > 0){
        // 元素存在的代码
    }
</script>

注意:

1、使用 jq 代码来判断元素是否存在时,必需要加上长度。

2、jq 操作的元素即使不存在也不会报错

3、如果使用以下的判断方法,则此判断会一直循环下去

错误判断代码示例

<script>
    //此判断是错误的,逻辑会一直循环
    if ($('#div')){
        //元素存在的操作代码
    }
</script>

原生js判断元素是否存在

在原生 javascript 的 getElementById() 和 getElementsByTagName() 方法来操作指定的元素时,如果被操作的元素不存在,则浏览器会抛出错误,并终止代码的运行,更新影响其后的代码运行。

为了避免上述情况的发生,所以在无法确定要操作的元素是否存在时,可以利用下面的判断代码来先判断元素是否存在,如果判断元素存在时,再写入操作的流程代码。

js代码

<script>
    if (document.getElementById("tt")){
        //元素存在的操作代码
    }
</script>