• JavaScript_1_简介


    1. JavaScript属于客户端脚本语言

    2. JavaScript用来改进网页设计、验证表单、检测浏览器、创建cookies,以及更多的应用

        a. 是为HTML设计者提供的一种编程工具

        b. 可以在HTML页面中放入动态的文本

        c. 能够对事件进行反应

        d. 可读取并修改HTML元素

        e. 可被用来验证数据

    举例:

        <p>JavaScript能够直接写入HTML输出流中:</p>
        <script>
            document.write("<h1>This is a heading</h1>");
            document.write("<p>This is a paragraph.</p>");
        </script>
        <p>JavaScrip能够对事件作出反应。比如对按钮的点击:</p>
        <button type="button" onclick="MyClick()">点击这里</button>
        <!--<button type="button" onclick="alert('Welcome!')">点击这里</button> 可以类似于委托--> 
        <script>
            function MyClick() {
                alert("Welcome!");
            }
        </script>
        <p id="d1">JavaScript改变HTML元素的内容</p>
        <button type="button" onclick="myfunction()">改变元素</button>
        <script>
            function myfunction()
            {
                x = document.getElementById("d1"); //找到元素
                x.innerHTML = "Hello JavaScript!";//改变内容
            }
        </script>
        <p>JavaScript改变HTML图像</p>
        <img id="myimage" onclick="changeImage()" src="image/lightoff.jpg" />
        <script>
            function changeImage() {
                x = document.getElementById("myimage");
                if(x.src.match("lightoff"))
                {
                    x.src = "image/lighton.jpg"
                }
                else {
                    x.src = "image/lightoff.jpg"
                }
            }
        </script>
        <p id="d2">JavaScript改变HTML的样式</p>
        <button type="button" onclick="changestyle()">改变样式</button>
        <script >
            function changestyle()
            {
                x = document.getElementById("d2");
                x.style.color = "red";
            }
        </script>
        <p>JavaScript用于输入验证</p>
        <input id="d3" type="text" />
        <button type="button" onclick="checknumber()">数字验证</button>
        <script>
            function checknumber()
            {
                x = document.getElementById("d3").value;
                if(x=""||isNaN(x))
                {
                    alert("Not Numeric");
                }
                else
                {
                    alert("OK");
                }
            }
        </script>
  • 相关阅读:
    Wiin10 深色模式 暗色 省电 经济 护眼dark mode energy saving ecol
    云主机终端现实中文
    systemctl enable与systemctl start的区别
    centos技巧
    用国内的vps登录亚马逊的ec2
    小米 redmi note 8 打开开发者选项
    javascript数组、对象和Null的typeof同为object,区分解决办法
    组件中是否可以判断slot是否有内容?
    xlsx-style 行高设置
    修改xlsx-style 源码 解决报错
  • 原文地址:https://www.cnblogs.com/xiao9426926/p/6598898.html
Copyright © 2020-2023  润新知