HTML 学习笔记 JavaScript（简介）

时间 2019-12-20

标签 html 学习笔记 javascript 简介栏目 HTML 繁體版

原文原文链接

JavaScript 是世界上最流行的编程语言。web

这门语言可用于HTML和web 更可普遍用于服务器、PC、笔记本电脑、平板电脑和智能手机等设备。编程

JavaScript是脚本语言浏览器

JavaScript是一种轻量级的编程语言服务器

JavaScript是可插入 HTML页面的编程代码编程语言

JavaScript 插入HTML页面后可由全部的现代浏览器执行函数

JavaScript 输出：测试

<script>
    document.write("<h1>这是标题</h1>");
    document.write("哈哈哈哈哈");
</script>

提示：你只能在HTML输出中使用document.write() 若是你在文档加载后使用该方法，会覆盖整个文档。ui

JavaScript 对事件做出反应:spa

<body>
        <button id="btn">点我哦</button>
        <script>
//            document.getElementById("btn").addEventListener("click",function(){
//                alert("点击btn触发我哦");
//            });
            //添加事件的另外一种方式
            document.getElementById("btn").onclick = function() {
                alert("点解我");
            };
        </script>
</body>

alert()函数在JavaScript中并非很经常使用可是它对于代码的测试很是方便设计

JavaScript 改变HTML的内容:

<body>
    <p id="fristP">我是第一段文字</p>
    <button id="btn">点我哦</button>
    <script>
        //获取文档元素
        var fristP = document.getElementById("fristP");
                document.getElementById("btn").addEventListener("click",function(){
                if (fristP.innerHTML == "我是第一段文字") {
                    fristP.innerHTML = "改变了哦";
                } else{
                    fristP.innerHTML = "我是第一段文字";
                }
            });
            
    </script>
</body>

JavaScript 改变HTML图像

<body>
        
    <img id="img1" src="img/HBuilder.png" />
    <br />
    <button id="btn">点我哦</button>
    <script>
        //获取文档元素
        var ele = document.getElementById("img1");
            document.getElementById("btn").addEventListener("click",changeImage);
            
        function changeImage() {
            ele.src = "img/PHP.png"
        }
            
    </script>
</body>

JavaScript 验证输入

    <body>
        
        请输入数字<input type="text" id="input1" />
        <br />
        <button id="btn">点我哦</button>
        <script>
            
            document.getElementById("btn").addEventListener("click",checkValue);
            
            function checkValue() {
                //获取文档元素
                var ele = document.getElementById("input1").value;
                if (ele == "" || isNaN(ele)) {
                    alert("Not Numberic");
                }
            }
            
        </script>
    </body>

提示：JavaScript 与 Java 是两种彻底不一样的语言，不管在概念仍是设计上。Java（由 Sun 发明）是更复杂的编程语言。ECMA-262 是 JavaScript 标准的官方名称。JavaScript 由 Brendan Eich 发明。它于 1995 年出如今 Netscape 中（该浏览器已中止更新），并于 1997 年被 ECMA（一个标准协会）采纳。