zoukankan      html  css  js  c++  java
  • 2-javascript::笔记

    0.位置:
    HTML 中的脚本必须位于 <script> 与 </script> 标签之间。
    脚本可被放置在 HTML 页面的 <body> 和 <head> 部分中。

    1.写自己的函数;

    2.document的相关函数:
    document.getElementById()
    document.getElementsByClassName()
    document.getElementsByName();
    document.getElementsByTagName();
    document.getElementsByTagNameNS;
    document.getElementById("demo").value;

    例子;
    2.1改变颜色:
    <p id="demo">
    JavaScript 能改变 HTML 元素的样式。
    </p>

    <script>
    function myFunction()
    {
    x=document.getElementById("demo") // 找到元素
    x.style.color="#ff0000"; // 改变样式
    }
    </script>
    <button type="button" onclick="myFunction()">点击这里</button>

    2.2切换图片:
    function changeImage()
    {
    element=document.getElementById('myimage')
    if (element.src.match(""))
    {
    element.src="/i/eg_bulboff.gif";
    }
    else
    {
    element.src="/i/eg_bulbon.gif";
    }
    }
    </script>

    2.3检测元素是否是字符串:isNaN(); (NaN: not a number)
    <p>请输入数字。如果输入值不是数字,浏览器会弹出提示框。</p>
    <input id="demo" type="text">
    <script>
    function myFunction()
    {
    var x=document.getElementById("demo").value;
    if(x==""||isNaN(x))
    {
    alert("Not Numeric");
    }
    }

    2.4document.write();
    /* 如果您在文档已加载后使用它(比如在函数中),会覆盖整个文档 */
    /*也就是说如果页面已经加载了,你用一个click事件去使用document.writer(),就会覆盖所有
    的已经存在于页面的内容*/
    <p>
    JavaScript 能够直接写入 HTML 输出流中:
    </p>

    <script>
    document.write("<h1>This is a heading</h1>");
    document.write("<p>This is a paragraph.</p>");
    </script>

    <p>
    您只能在 HTML 输出流中使用 <strong>document.write</strong>。
    </p>

    3.js拥有动态数据类型:

    3.1变量:
    var x // x 为 undefined
    var x = 6; // x 为数字
    var x = "Bill"; // x 为字符串
    var y=123e5; // 12300000
    var z=123e-5; // 0.00123
    var x=true //布尔(逻辑)只能有两个值:true 或 false。
    var y=false
    3.2数组:
    <script>
    var i;
    var cars = new Array();
    cars[0] = "Audi";
    cars[1] = 2.4;
    cars[2] = "Volvo";

    for (i=0;i<cars.length;i++){
    document.write(cars[i] + "<br>");
    }
    </script>
    /*等价于:*/
    var cars=["Audi","BMW","Volvo"];
    3.3对象:
    定义:
    var person={
    firstname : "Bill",
    lastname : "Gates",
    id : 5566
    };
    对象属性的寻址方式:
    name=person.lastname;
    name=person["lastname"];
    3.4:当您声明新变量时,可以使用关键词 "new" 来声明其类型
    var carname=new String;
    var x= new Number;
    var y= new Boolean;
    var cars= new Array;
    var person= new Object;
    注意:JavaScript 变量均为对象。当您声明一个变量时,就创建了一个新的对象。

    4.验证输入:
    <script>
    function myFunction()
    {
    var x=document.getElementById("demo").value;
    if(x==""||isNaN(x))
    {
    alert("Not Numeric");
    }
    }
    </script>

  • 相关阅读:
    gcc 工作流程和常用参数
    解决webstorm卡顿问题,下面详细设置方法,使得webstorm快速打开
    使用vue 3.0 初始化vue脚手架
    vue父组件更新,子组件也更新的方法
    vue 父子组件渲染
    数组对象去重 reduce()
    webstorm 点击右上角运行run 启动vue项目
    寻找的常用webstorm快捷键
    mORMot使用基础1(转)
    win7共享win10打印机提示无法连接到打印机 错误 bcb
  • 原文地址:https://www.cnblogs.com/zhumengdexiaobai/p/9166115.html
Copyright © 2011-2022 走看看