zoukankan      html  css  js  c++  java
  • JavaScript-HTML

    JavaScript

    JavaScript(简称JS),他是一门HTML的脚本语言,用来改进设计、验证表单、检测浏览器、创建cookies,以及更多的应用。

    他的用法及语法类似于Visual Studio 2012(简称VS)。注释的格式/*.注释一段.*/  //注释一行

    JS的写入HTML的输出语句是:

    <script>
        document.write("要显示的内容")
    </script>

    1.在网页上的显示:

    image

    2.JS可以对事件作出反应,比如点击按钮:

    alert() 函数在 JavaScript 中并不常用,但它对于代码测试非常方便。

    onclick 的意思 是点击事件。

    alert  onclick都是JS里的语句,它们可以不用专门包裹在<script></script>之间。

    <button type="button" onclick="alert('欢迎来到这里!')">点击按钮</button>

    点击按钮后显示:

    image

    3.JS可以改变HTML的内容

    复制代码
    <p id="demo">
    JavaScript 能改变 HTML 元素的内容。
    </p>
    <script>
    function myFunction()
    {
    x=document.getElementById("demo");  // 找到元素
    x.innerHTML="Hello JavaScript!";    // 改变内容
    }
    </script>
    <button type="button" onclick="myFunction()">点击这里</button>
    复制代码

    image点击后:image

    同理可以修改HTML的元素样式:

    加入代码  x.style.color="#ff0000";

    复制代码
    <p id="demo">
    JavaScript 能改变 HTML 元素的内容。
    </p>
    
    <script>
    function myFunction()
    {
    x=document.getElementById("demo");  // 找到元素
    x.innerHTML="Hello JavaScript!";    // 改变内容
    x.style.color="#ff0000";  //红色
    }
    /script>
    
    <button type="button" onclick="myFunction()">点击这里</button>
    复制代码

    image

    4.JS验证输入

    复制代码
    <p>请输入数字。如果输入值不是数字,浏览器会弹出提示框。</p>
    
    <input id="demo" type="text">
    
    <script>
    function myFunction()
    {
    var x=document.getElementById("demo").value;/*(根据id)获取输入框中的的值*/
    if(x==""||isNaN(x))/*NaN,不是数字,返回true(表示不是数字)或者false(表示是数字)  */
        {
        alert("不是数字");/*弹出对话框*/
        }
    }
    </script>
    
    <button type="button" onclick="myFunction()">点击这里</button>
    复制代码

    JavaScript 对大小写是敏感的。

  • 相关阅读:
    dom4j修改,获取,增加xml中某个元素的属性值
    SVN功能详解
    采用RPC方式和document方式 开发Axis2的WebService客户端
    记录我电脑的环境变量配置
    Java float保留两位小数或多位小数
    c#中获取服务器IP,客户端IP以及Request.ServerVariables详细说明
    说说Java观察者模式
    2018第12周总结
    聊聊Java反射
    Java注解总结2
  • 原文地址:https://www.cnblogs.com/dlexia/p/4505041.html
Copyright © 2011-2022 走看看