js笔记一

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了js笔记一相关的知识,希望对你有一定的参考价值。

.脚本可位于 html 的 <body> 或 <head> 部分中,或者同时存在于两个部分中,也可以把脚本保存到外部文件中

    <script src="myScript.js"></script>


.javascript 可以通过不同的方式来输出数据:

    使用 window.alert() 弹出警告框。

    使用 document.write() 方法将内容写到 HTML 文档中。

    使用 innerHTML 写入到 HTML 元素。

    使用 console.log() 写入到浏览器的控制台。


.JavaScript 对大小写是敏感的。


.可以在文本字符串中使用反斜杠对代码行进行换行


.对象定义

var person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};

var person = {

   firstName : "John",

   lastName : "Doe",

   id : 5566

};

document.getElementById("demo").innerHTML =

person.firstName + " " + person.lastName;


var person = {

   firstName: "John",

   lastName : "Doe",

   id : 5566

};

document.getElementById("demo").innerHTML =

person["firstName"] + " " + person["lastName"];


.在 HTML 中, 全局变量是 window 对象: 所有数据变量都属于 window 对象。


.以下是 HTML 事件的实例:

    HTML 页面完成加载

    HTML input 字段改变时

    HTML 按钮被点击  

    <button onclick=‘getElementById("demo").innerHTML=Date()‘>现在的时间是??</button>

    <button onclick="this.innerHTML=Date()">现在的时间是?</button>


.常见的HTML事件

下面是一些常见的HTML事件的列表:

事件 描述

onchange HTML 元素改变

onclick 用户点击 HTML 元素

onmouseover 用户在一个HTML元素上移动鼠标

onmouseout 用户从一个HTML元素上移开鼠标

onkeydown 用户按下键盘按键

onload 浏览器已完成页面的加载


.For/In 循环---JavaScript for/in 语句循环遍历对象的属性:

var person={fname:"John",lname:"Doe",age:25}; 

 

for (x in person)

{

   txt=txt + person[x];

}


.constructor 属性

constructor 属性返回所有 JavaScript 变量的构造函数。

实例

"John".constructor                 // 返回函数 String()  { [native code] }

(3.14).constructor                 // 返回函数 Number()  { [native code] }

false.constructor                  // 返回函数 Boolean() { [native code] }

[1,2,3,4].constructor              // 返回函数 Array()   { [native code] }

{name:‘John‘, age:34}.constructor  // 返回函数 Object()  { [native code] }

new Date().constructor             // 返回函数 Date()    { [native code] }

function () {}.constructor         // 返回函数 Function(){ [native code] }


.typeof 操作符

你可以使用 typeof 操作符来查看 JavaScript 变量的数据类型。

实例

typeof "John"                         // 返回 string 

typeof 3.14                            // 返回 number

typeof NaN                            // 返回 number

typeof false                            // 返回 boolean

typeof [1,2,3,4]                       // 返回 object

typeof {name:‘John‘, age:34} // 返回 object

typeof new Date()                  // 返回 object

typeof function () {}                 // 返回 function

typeof myCar                         // 返回 undefined (如果 myCar 没有声明)

typeof null                              // 返回 object


.使用 constructor 属性来查看对象是否为数组 (包含字符串 "Array"):

实例

function isArray(myArray) {

   return myArray.constructor.toString().indexOf("Array") > -1;

}



.将数字转换为字符串

全局方法 String() 可以将数字转换为字符串。

该方法可用于任何类型的数字,字母,变量,表达式:

实例

String(x)         // 将变量 x 转换为字符串并返回

String(123)       // 将数字 123 转换为字符串并返回

String(100 + 23)  // 将数字表达式转换为字符串并返回


Number 方法 toString() 也是有同样的效果。

实例

x.toString()

(123).toString()

(100 + 23).toString()


eg1:

    document.getElementById("demo").innerHTML=Date();


eg2:

    document.write("<h1>这是一个标题</h1>");


eg3:

    alert(‘欢迎!‘)


eg4:

    function changeImage()

    {

     element=document.getElementById(‘myimage‘)

     if (element.src.match("bulbon"))

      {

      element.src="/images/pic_bulboff.gif";

      }

     else

       {

      element.src="/images/pic_bulbon.gif";

       }

    }


    function myFunction()

    {

     x=document.getElementById("demo") // 找到元素

     x.style.color="#ff0000";          // 改变样式

    }

    

    function myFunction()

    {

     var x=document.getElementById("demo").value;

     if(x==""||isNaN(x))

     {

     alert("不是数字");

     }

    }


    var person = {

        firstName: "John",

        lastName : "Doe",

        id : 5566,

        fullName : function() 

     {

           return this.firstName + " " + this.lastName;

        }

    };

    document.getElementById("demo").innerHTML = person.fullName();

    document.getElementById("demo1").innerHTML = "不加括号输出函数表达式:"  + person.fullName;

    document.getElementById("demo2").innerHTML = "加括号输出函数执行结果:"  + 

 person.fullName();


eg5: 

    var txt = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";

    var sln = txt.length;


eg6:

    cars=["BMW","Volvo","Saab","Ford"];

    list: 

    {

        document.write(cars[0] + "<br>"); 

        document.write(cars[1] + "<br>"); 

        document.write(cars[2] + "<br>"); 

        break list;

        document.write(cars[3] + "<br>"); 

        document.write(cars[4] + "<br>"); 

        document.write(cars[5] + "<br>"); 

    }

    



以上是关于js笔记一的主要内容,如果未能解决你的问题,请参考以下文章

Js笔记一

js自学笔记—— 基础部分一

node.js学习笔记一

js笔记一

学习笔记JS进阶语法一DOM进阶

JS第一课时笔记