运行如下代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

    <head>

        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

        <title>页面未加载执行失败</title>

        <script type="text/javascript">

            document.getElementById("panel").onclick = function() {

                alert("元素已经加载完毕 !");

            }

        </script>

    </head>

    <body>

        <div id="panel">click me.</div>

    </body>

</html>

发现怎么点都不会出现提示的内容，这是为什么呢

那是因为dom还未加载完毕，那么如何解决呢？

　　　　　　　　方式一：将JS代码移到需要操作的html代码后面，建议放到body的外面

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

    <head>

        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

        <title>4-1-2</title>

    </head>

    <body>

        <div id="panel">click me.</div>

        <script type="text/javascript">

                document.getElementById("panel").onclick = function() {

                    alert("元素已经加载完毕 !");

                }

        </script>

    </body>

</html>

方法二：将其写入页面加载函数，这样也可以

jQuery_页面加载问题的更多相关文章

  1. AnjularJS系列4 —— 单个页面加载多个ng-App

    第四篇,插播, 单个页面加载多个ng-App 在写范例的时候发现的问题 一个页面有多个ng-app,angular只会处理第一个ng-app 需要加载两个ng-app,需要进行手动加载: angula ...

  2. jQuery页面加载初始化的3种方法

    jQuery 页面加载初始化的方法有3种 ,页面在加载的时候都会执行脚本,应该没什么区别,主要看习惯吧,本人觉得第二种方法最好,比较简洁. 第一种: $(document).ready(functio ...

  3. 页面加载完成后，触发事件——trigger（）

    <button id="btn">点击我</button> <div id="test"></div> 如果页面 ...

  4. css3 linear-gradient实现页面加载进度条效果

    最终效果图: html结构: <div>    <p class="p1">        <span></span>    < ...

  5. 使用 v-cloak 防止页面加载时出现 vuejs 的变量名

    使用 vuejs 做了一个简单的功能页面,逻辑是,页面加载后获取当前的经纬度,然后通过 ajax 从后台拉取附近的小区列表.但是 bug 出现了,在显示小区列表之前,会闪现小区名对应的 vuejs 变 ...

  6. js jquery 页面加载初始化方法

    js jquery 页面加载初始化方法 一.js页面加载初始化方法 // 1.在body里面写初始化方法. <body onload='init()'> </body> < ...

  7. JavaScript在A页面判断B页面加载完毕（iframe load）

    今天遇到一个需求,在A页面上判断B页面是否加载完毕(B页面是第三方页面),加载完毕时隐藏loading动画... 而平时我们一般做的事是在B页面上判断B页面是否加载完毕,进行操作. if(docume ...

  8. javascript 实现页面加载完再显示页面

    document.onreadystatechange = function () { if (document.readyState == "complete") { docum ...

  9. java selenium (十三) 智能等待页面加载完成

    我们经常会碰到用selenium操作页面上某个元素的时候, 需要等待页面加载完成后, 才能操作.  否则页面上的元素不存在,会抛出异常. 或者碰到AJAX异步加载,我们需要等待元素加载完成后, 才能操 ...

随机推荐

  1. 第二大矩阵面积--（stack）牛客多校第二场-- Second Large Rectangle

    题意: 给你一幅图,问你第二大矩形面积是多少. 思路: 直接一行行跑stack求最大矩阵面积的经典算法,不断更新第二大矩形面积,注意第二大矩形可能在第一大矩形里面. #define IOS ios_b ...

  2. 使用antd List组件实现轮播图

    import { List, Avatar, Carousel } from 'antd'; import { connect } from 'dva'; import './lamp.less' c ...

  3. Mysql学习（三）之数据库管理工具Navicat

    前言 mysql安装完后默认只有命令行工具,所以我们可以下载一些数据库管理工具Navicat Navicat使用 首先建立一个连接选择mysql,填写信息 发现多了一个localhost,双击,打开连 ...

  4. springcloud(十一)-Zuul聚合微服务

    前言 我们接着上一节.在许多场景下,外部请求需要查询Zuul后端的多个微服务.比如一个电影售票手机APP,在购票订单页上,既需要查询“电影微服务”获得电影相关信息,又需要查询“用户微服务”获得当前用户 ...

  5. 03 Linux下运行Django项目

    1.安装windows和linux传输文件的工具 pip install lrzsz 提供两个命令 一个是上传一个是下载 rz 接收 直接rz sz 上传 直接sz 或者直接拖拽 2.在线下载资源的命 ...

  6. Nginx配置,请求到tomcat中

    一.web服务器分为两类 1.web服务器 1)Apache服务器 2)Nginx 3)IIS 2.web 应用服务器 1)tomcat 2)resin 3)jetty 区分:web服务器不能解析js ...

  7. python cv2截取不规则区域图片

    知识掌握 cv2.threshold()函数: 设置固定级别的阈值应用于多通道矩阵,将灰度图像变换二值图像,或去除指定级别的噪声,或过滤掉过小或者过大的像素点. Python: cv2.thresho ...

  8. QQ恶搞 - 让艾特你的人语无伦次

    效果图: 实现过程: 代码: ‮ 将上面的代码复制添加到你的群名片后面即可. 原理解析: 这个代码是一个Unicode控制字符 - RLO,它可以控制在它后面的所有文本都已倒序的方式显示.在qq群艾特 ...

  9. 测试Random类nextInt()方法连续两次结果一样的概率

    public static void main(String[] args) { int count = 0; int a = 0; Random r = new Random(); while (t ...

  10. 4.（基础）tornado应用安全与认证

    这一节我们介绍应用安全与认证,其实中间省略了一个数据库.对于tornado来说,读取数据库的数据,性能的瓶颈还是在数据库上面.关于数据库,我在<>中介绍了sqlalchemy,这是一个工业 ...