zoukankan      html  css  js  c++  java
  • js使用

    js使用

    HTML 中的脚本必须位于 <script> 与 </script> 标签之间。

    脚本可被放置在 HTML 页面的 <body> 和 <head> 部分中。

      1.JavaScript 对大小写是敏感的。

      2.JavaScript 会忽略多余的空格。您可以向脚本添加空格,来提高其可读性。

    Test:点击按钮改变标签内容

    <!DOCTYPE html>
    <html>
    <body>
    
    <h1>My Web Page</h1>
    
    <p id="myPar">I am a paragraph.</p>
    <div id="myDiv">I am a div.</div>
    
    <p>
    <button type="button" onclick="myFunction()">点击这里</button>
    </p>
    
    <script>
    function myFunction()
    {
    document.getElementById("myPar").innerHTML="Hello World";
    document.getElementById("myDiv").innerHTML="How are you?";
    }
    </script>
    
    <p>当您点击上面的按钮时,两个元素会改变。</p>
    
    </body>
    </html>
    

      3.对代码行进行折行

    您可以在文本字符串中使用反斜杠对代码行进行换行。下面的例子会正确地显示:

    document.write("Hello 
    World!");
    

    不过,您不能像这样折行:

    document.write 
    ("Hello World!");

    4.JavaScript 注释

    JavaScript 不会执行注释。

    我们可以添加注释来对 JavaScript 进行解释,或者提高代码的可读性。

    单行注释以 // 开头。

    5。JavaScript 多行注释

    多行注释以 /* 开始,以 */ 结尾。

    6.允许在行末使用注释

    ————————————————————————————————————————————————————

    js变量

    ————————————————————————————————————————————————————

      变量是存储信息的容器。

    实例

    <!DOCTYPE html>
    <html>
    <body>
    
    <script>
    var x=2;
    var y=3;
    var z=2+3;
    
    document.write(x + "<br>");
    document.write(y + "<br>");
    document.write(z + "<br>");
    </script>
    
    </body>
    </html>
    

      

    JavaScript 变量

    与代数一样,JavaScript 变量可用于存放值(比如 x=2)和表达式(比如 z=x+y)。

    变量可以使用短名称(比如 x 和 y),也可以使用描述性更好的名称(比如 age, sum, totalvolume)。

    • 变量必须以字母开头
    • 变量也能以 $ 和 _ 符号开头(不过我们不推荐这么做)
    • 变量名称对大小写敏感(y 和 Y 是不同的变量)

    提示:JavaScript 语句和 JavaScript 变量都对大小写敏感。

    JavaScript 数据类型

    JavaScript 变量还能保存其他数据类型,比如文本值 (name="Bill Gates")。

    在 JavaScript 中,类似 "Bill Gates" 这样一条文本被称为字符串。

    JavaScript 变量有很多种类型,但是现在,我们只关注数字和字符串。

    当您向变量分配文本值时,应该用双引号或单引号包围这个值。

    当您向变量赋的值是数值时,不要使用引号。如果您用引号包围数值,该值会被作为文本来处理。

    声明(创建) JavaScript 变量

    在 JavaScript 中创建变量通常称为“声明”变量。

    我们使用 var 关键词来声明变量:

    var carname;

    变量声明之后,该变量是空的(它没有值)。

    如需向变量赋值,请使用等号:

    carname="Volvo";

    不过,您也可以在声明变量时对其赋值:

    var carname="Volvo";

    JavaScript 数据类型

    字符串、数字、布尔、数组、对象、Null、Undefined

    JavaScript 布尔

    布尔(逻辑)只能有两个值:true 或 false。

    var x=true
    var y=false

    JavaScript 数组

    下面的代码创建名为 cars 的数组:

    var cars=new Array();
    cars[0]="Audi";
    cars[1]="BMW";
    cars[2]="Volvo";
    

    或者 (condensed array):

    var cars=new Array("Audi","BMW","Volvo");
    

    或者 (literal array):

    实例

    var cars=["Audi","BMW","Volvo"];

    JavaScript 对象

    对象由花括号分隔。在括号内部,对象的属性以名称和值对的形式 (name : value) 来定义。属性由逗号分隔:

    var person={firstname:"Bill", lastname:"Gates", id:5566};

    上面例子中的对象 (person) 有三个属性:firstname、lastname 以及 id。

    空格和折行无关紧要。声明可横跨多行:

    var person={
    firstname : "Bill",
    lastname  : "Gates",
    id        :  5566
    };
    

    对象属性有两种寻址方式:

    实例

    name=person.lastname;
    name=person["lastname"];

    Undefined 和 Null

    Undefined 这个值表示变量不含有值。

    可以通过将变量的值设置为 null 来清空变量。

    实例

    cars=null;
    person=null;

    声明变量类型

    当您声明新变量时,可以使用关键词 "new" 来声明其类型:

    var carname=new String;
    var x=      new Number;
    var y=      new Boolean;
    var cars=   new Array;
    var person= new Object;



    JavaScript 对象

    JavaScript 变量均为对象。当您声明一个变量时,就创建了一个新的对象。

    JavaScript 中的所有事物都是对象:字符串、数字、数组、日期,等等。

    在 JavaScript 中,对象是拥有属性和方法的数据。

    属性和方法

    属性是与对象相关的值。

    方法是能够在对象上执行的动作。

    对于对象的理解

    举例:汽车就是现实生活中的对象。

    汽车的属性:

    car.name=Fiat
    
    car.model=500
    
    car.weight=850kg
    
    car.color=white 
    

    汽车的方法:

    car.start()
    
    car.drive()
    
    car.brake()
    

    汽车的属性包括名称、型号、重量、颜色等。

    所有汽车都有这些属性,但是每款车的属性都不尽相同。

    汽车的方法可以是启动、驾驶、刹车等。

    所有汽车都拥有这些方法,但是它们被执行的时间都不尽相同。

    在面向对象的语言中,属性和方法常被称为对象的成员。

    创建 JavaScript 对象

    JavaScript 中的几乎所有事务都是对象:字符串、数字、数组、日期、函数,等等。

    你也可以创建自己的对象。

    本例创建名为 "person" 的对象,并为其添加了四个属性:

    实例

    person=new Object();
    person.firstname="Bill";
    person.lastname="Gates";
    person.age=56;
    person.eyecolor="blue";

    访问对象的属性

    访问对象属性的语法是:

    objectName.propertyName

    本例使用 String 对象的 length 属性来查找字符串的长度:

    var message="Hello World!";
    var x=message.length;
    

    在以上代码执行后,x 的值是:

    12

    访问对象的方法

    您可以通过下面的语法调用方法:

    objectName.methodName()

    这个例子使用 String 对象的 toUpperCase() 方法来把文本转换为大写:

    var message="Hello world!";
    var x=message.toUpperCase();
    

    在以上代码执行后,x 的值是:

    HELLO WORLD!

    JavaScript 函数

    函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块。

    JavaScript 函数语法

    函数就是包裹在花括号中的代码块,前面使用了关键词 function:

    function functionname()
    {
    这里是要执行的代码
    }
    

    当调用该函数时,会执行函数内的代码。

    可以在某事件发生时直接调用函数(比如当用户点击按钮时),并且可由 JavaScript 在任何位置进行调用。

    提示:JavaScript 对大小写敏感。关键词 function 必须是小写的,并且必须以与函数名称相同的大小写来调用函数。

    全局 JavaScript 变量

    在函数外声明的变量是全局变量,网页上的所有脚本和函数都能访问它。

    JavaScript 变量的生存期

    JavaScript 变量的生命期从它们被声明的时间开始。

    局部变量会在函数运行以后被删除。

    全局变量会在页面关闭后被删除。

    JavaScript 赋值运算符

    赋值运算符用于给 JavaScript 变量赋值。

    给定 x=10 和 y=5,下面的表格解释了赋值运算符:

    用于字符串的 + 运算符

    + 运算符用于把文本值或字符串变量加起来(连接起来)。

    如需把两个或多个字符串变量连接起来,请使用 + 运算符。

    txt1="What a very";
    txt2="nice day";
    txt3=txt1+txt2;
    

    在以上语句执行后,变量 txt3 包含的值是 "What a verynice day"。

    要想在两个字符串之间增加空格,需要把空格插入一个字符串之中:

    txt1="What a very ";
    txt2="nice day";
    txt3=txt1+txt2;
    

    或者把空格插入表达式中:

    txt1="What a very";
    txt2="nice day";
    txt3=txt1+" "+txt2;
    

    在以上语句执行后,变量 txt3 包含的值是:

    "What a very nice day"

    对字符串和数字进行加法运算

    请看这些例子:

    x=5+5;
    document.write(x);
    
    x="5"+"5";
    document.write(x);
    
    x=5+"5";
    document.write(x);
    
    x="5"+5;
    document.write(x);


    规则是:

    如果把数字与字符串相加,结果将成为字符串。

    如何使用

    可以在条件语句中使用比较运算符对值进行比较,然后根据结果来采取行动:

    if (age<18) document.write("Too young");

    您将在本教程的下一节中学习更多有关条件语句的知识。

    逻辑运算符

    逻辑运算符用于测定变量或值之间的逻辑。

    给定 x=6 以及 y=3,下表解释了逻辑运算符:

    条件运算符

    JavaScript 还包含了基于某些条件对变量进行赋值的条件运算符

    语法

    运算符描述例子
    && and (x < 10 && y > 1) 为 true
    || or (x==5 || y==5) 为 false
    ! not !(x==y) 为 true

     

     

    
    

    例子variablename=(condition)?value1:value2 

    greeting=(visitor=="PRES")?"Dear President ":"Dear ";

    如果变量 visitor 中的值是 "PRES",则向变量 greeting 赋值 "Dear President ",否则赋值 "Dear"。

  • 相关阅读:
    Web前端的状态管理(State Management)
    使用iScroll实现上拉或者下拉刷新
    实现checkbox组件化(Component)
    HTML5 文件异步上传 — h5uploader.js
    利用javascript和WebGL绘制地球 【翻译】
    利用JS跨域做一个简单的页面访问统计系统
    Java JSON、XML文件/字符串与Bean对象互转解析
    JS实现星级评价
    Spring中@Component注解,@Controller注解详解
    制作滑动条菜单,如何延时处理滑动效果,避免动画卡顿
  • 原文地址:https://www.cnblogs.com/Maxq/p/6098727.html
Copyright © 2011-2022 走看看