运行如下代码：

<!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. TCP/IP 协议是如何保证数据可靠性的？

    原文: 网络基础:TCP协议-如何保证传输可靠性 TCP协议传输的特点主要就是面向字节流.传输可靠.面向连接.这篇博客,我们就重点讨论一下TCP协议如何确保传输的可靠性的. 确保传输可靠性的方式TCP ...

  2. C数据结构排序算法——希尔排序法用法总结（转http://www.cnblogs.com/skywang12345/p/3597597.html）

    希尔排序介绍 希尔排序(Shell Sort)是插入排序的一种,它是针对直接插入排序算法的改进.该方法又称缩小增量排序,因DL．Shell于1959年提出而得名. 希尔排序实质上是一种分组插入方法.它 ...

  3. 今天发布MVC项目一直找不到页面

    刚开始以为是framwork版本太高,服务器没安装. 后面想到应用池版本忘记选了

  4. 100、神器的 routing mesh （Swarm07）

    参考https://www.cnblogs.com/CloudMan6/p/7930321.html   上一节我们提到了 swarm 的 routing mesh .当外部访问任意节点的8080端口 ...

  5. 部署 12306 github 项目

    郑重声明, 本文仅用作学习研究使用,请勿用作商业用途,遵守法律!!! 部署环境有些坑,踩一次就够了... 原项目地址 git clone 原项目以及 识别验证码的模型 如果遇到 无法解析的问题 ,则 ...

  6. nginx redirect ignore port 两层nginx跳转忽略了端口

    问题: 两层nginx做代理,第一层:nginx:将9087->代理到80端口,第二层:将80端口->流量打到我们的代码上,结果在代码中拿到的链接不带9087端口,则代码中发生跳转的时候, ...

  7. CentOS 7系统时间与实际时间差8个小时

    1.查看系统时间: [root@localhost sysconfig]# timedatectl Local time: 一 2017-11-06 21:13:19 CST Universal ti ...

  8. C++中写文件ofstream 的<< 操作符 与C风格的fwrite 的笔记

    在某次工作中,调用了某SDK接口,该接口通过一个回调函数返回需要的内容.我们需要的内容是H.264码流,该码流通过一个unsigned char* 变量带回,另外还有一个长度 int length.为 ...

  9. springboot集成dubbo服务报错No provider available for the service

    检查了下发现是因为没有正确编写暴露服务的注解,需要注意下: @Service(interfaceClass = StudentService.) @Component public class Stu ...

  10. ZOJ red black tree

    #include <bits/stdc++.h> #define fi first #define se second #define lson l,m,rt<<1 #defi ...