javaScript笔记01

  所谓勇气就是明知前方的路途充满了荆棘险阻,但还是义无反顾的的走下去。

  1 Javasrcipt定义的三种方式

   ·1 head中的script脚本

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>js-01</title>
    <script type="text/javascript">
        alert('hello World!');
    </script>
</head>
<body>
    你好,body!
</body>
</html>

执行顺序是先会弹出“hello World!”,然后界面显示‘你好,body!’

   ·2 超链接中直接定义

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>js-02</title>
</head>
<body>
    <a href="javascript:alert(0)">我是js</a>
</body>
</html>

这个点击超链接就会执行弹出框;

   ·3 外部引入js的方式

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>js-03</title>
    <script type="text/javascript" src="index.js"></script>
</head>
<body>
    <div id="mydiv">this is div</div>
</body>
</html>

index.js文件很简单:

alert("你好,index.js");

但是此时会存在问题的,如果js对div标签存在一定的操作,那么会出现问题:

修改index.js文件:

alert("你好,index.js");
// 获取div的id
var id=document.getElementById("mydiv");
alert(id);

此时由于先执行Javascript脚本,但是js获取div的id时还没有执行到div的标签,那么获取的div的id就是null.此时我们可以将script定义在div的下面,或者使用window.onload()函数来解决,此函数的功能是等待页面加载完毕之后才执行js脚本:

// 等待页面加载完毕执行js脚本
window.onload=function(){
    alert("你好,index.js");
    // 获取div的id
    var id=document.getElementById("mydiv");
    alert(id);
}
原文地址:https://www.cnblogs.com/gosaint/p/8372810.html