首先感谢 http://www.w3school.com.cn/js/index.asp

学js真的很方便，&下面的内容其实是我自己做的一个备忘

第一节    大致了解

一    js基本介绍

    1.轻量级脚本语言

    2.可插入html，插入后可使用浏览器执行

二     js输出

    document.write("中间写你要输出的东西");//在加载完全部文字后，再次使用它，会覆盖之前的内容

    alert("弹出框，输入你要弹出的东西");

三    js对事件作出反应

    <button type = "button" onclick = "alert('欢迎！')">点击这里</button>

    （创建一个点击这里的按钮，点击后弹出对话框“欢迎”）

四    改变HTML内容（包括文字图片等）

    <p id="demo">

        JavaScript 能改变 HTML 元素的内容。

    </p>

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

    x.innerHTML="Hello JavaScript!";    // 改变内容

五     其他杂七杂八

    1.js中，用分号表示语句的结束是可选的

    2.大小学敏感

    3.无视多余的空格

    4.可以换行，用“\”

        eg. document.write("Hello \

            World!");————————————————————true

            document.write \

            ("Hello World!");————————————false

    5.单行注释            //

    6.多行注释            /*     */

第二节 怎么写一个hello world

一    js的使用

    <html>

        <head>//通常把函数放在head里面

            <script>

                //中间写你的js代码

            </script>

        </head>

        <body>

            <script>

                //中间写你的js代码

            </script>

        </body>

    </html>

第三节     基础语法

一 变量的声明与类型

    1.所有的变量声明都是

        var w;//未经赋值，是空的

        var a = 123;

        var b = "4560";

        var c = "15", d = 16;//可以一行赋值多个

        var c = "15", //可以分行赋值

        d = 16;

    2.注意事项

        必须字母或者$ _开头

        大小写敏感

        （最好）在代码开始处，对所需要的变量进行声明

    3.类型

        js是动态类型，相同的变量可以用作不同的类型

        js中，所有变量都是对象

        1.字符串

            var a = "123";

        2.数字

            var a = 12;

            var a = 12.01;

            var a = 12e15;

            var a = 12e-15;

        3.布尔

            var a = true;

            var a = false;

        4.数组

            var a = new Array();

            a[0] = "1";

            a[1] = "2";

            var a = new Array("1", "2");

            var a = ["1", "2"];

        5.对象

            //声明

            //

            var person =

            {

                firstName    :    "ABC",

                lastName    :    "DEF",

                id            :    "45789"

            };

            //

            var person = new Object();

            person.firstName = "ABC";

            person.lastName = "DEF";

            person.id = “456780”;

            //使用

            var targetName = person.lastName;

            var targetName = person["lastName"];

        6.Null

            可以用Null清空变量

            a = null;

        7.Undefined

            表示不含有值

        声明新变量时，可使用new表明类型

            var carname=new String;

            var x=      new Number;

            var y=      new Boolean;

            var cars=   new Array;

            var person= new Object;

二     Js的对象

    技术中，所有的变量都是对象

    js中，对象是拥有属性和方法的数据

    1.访问对象的属性的语法是

    targetObject.propertyName

    //对象名.属性名

    2.访问对象的方法的语法

    //对象名.方法名(参数)；

    注意，与C#不同，js的方法名常常首字母小写

三     函数

    function 函数名(变量一, 变量二 。。。。)

    {

        //要执行的代码

        //有返回值就直接return

    }

    eg.

        function add(num1, num2)

        {

            var c = num1 + num2;//他是局部变量，函数运行完就会删除

            return c;

            //你也可以直接return；

        }

        &

        var a = add(2,3);

        a最终等于的是5，而不是add函数

    函数外面声明的变量全是全局变量，即所有位置都能够访问

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

    将一个值赋给未生明的变量，他将是全局变量，即使他在函数里面

四     运算符，比较符，与或非

    //这个没什么好说的，与C#相同

五     判断语句if

    if (time<10)

    {

        x="Good morning";

    }

    else if (time<20)

    {

        x="Good day";

    }

    else

    {

        x="Good evening";

    }

    //除了elseif中间加了空格，其余与C#完全相同

六    选择语句

    //与C#完全相同

七    循环

    //所有循环的注意事项

    //不要死循环！！！

    //for 中的三个部分都输可选的

    for(var i = 0; i < 100; i++)

    {

        document.write("hahaha" + i);

    }

    for (var i=0,len=cars.length; i<len; i++)

    {

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

    }

    //遍历对象中的所有属性

    for(a in person)

    {

        txt = txt + person[x];

    }

    //下面两个与C#中的一样

    while (i<5)

    {

        x=x + "The number is " + i + "<br>";

        i++;

    }

    do

    {

        x=x + "The number is " + i + "<br>";

        i++;

    }

    while (i<5);

    break;//除了C#中的用法，还可以用在有标签的引用中

    eg.

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

        list://这个是标签，进行标记，个人理解，类似于C#里面的 #region

        {

            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>");

        }

    continue;//同C#

八     异常处理

    try

    {

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

        //下面是定义错误类型

        if(x=="")    throw "empty";

        if(isNaN(x)) throw "not a number";

        if(x>10)     throw "too high";

        if(x<5)      throw "too low";

    }

    catch(err)

    {

        var y=document.getElementById("mess");

        y.innerHTML="Error: " + err + ".";

    }

第四节    稍微高级一点的应用

一     JS HTML DOM（js，html文本对象模型）

    1.JS功能

        1.能够改变页面中所有的HTML元素

        2.------------------------属性

        3.--------------------CSS样式

        4.--------------------事件作出反应

    2.查找HTML元素

        1.通过Id查找

            var x = document.getElementById("id名字");

            //如果没有找到，则x = null

        2.通过标签查找

            var x = document.getElementById("Id名字");

            var y=x.getElementsByTagName("p");//查找<p>标签内容

            //y是数组，通过数组来确定使用第几个标签中的值

    3.改变html中的内容

        document.getElementById("p1").innerHTML = "New text!";

        //获取到内容                  （属性）显示在html中的东西

    4.改变html中的属性

        document.getElementById("image").src="landscape.jpg";

        //更换图片资源

    5.改变html中的样式

        document.getElementById("p2").style.color="blue";

        //style 是关键词

    6.隐藏html中的内容

        document.getElementById('p1').style.visibility='hidden'(或者visible);

    7.事件

        onclick//点击

        onmouseover //鼠标放上

        onmouseout //鼠标离开

        onfocus //鼠标选中（点击）

        onchange //内容改变

        onload    //加载页面开始

        onunload  //退出页面时

        //定义按钮时，直接定义店家事件

        <button onclick="displayDate()">点击这里</button>

        //给按钮加上Id，在其他地方获取然后添加事件属性

        document.getElementById("myBtn").onclick=function(){displayDate()};

    8.节点

        var para=document.createElement("p");//创建元素<p>

        var node=document.createTextNode("这是新段落。");//创建要添加的文本

        para.appendChild(node);//将文本添加带你创建的元素中

        var element=document.getElementById("div1");//找到一个已有的节点

        element.appendChild(para);//将你创建的元素添加到已有的标签中

        var parent=document.getElementById("div1");

        var child=document.getElementById("p1");

        parent.removeChild(child);//从一个父节点中移除一个子元素

        var child=document.getElementById("p1");

        child.parentNode.removeChild(child);//从当前所在的父节点中删除自己

第五节     对象

    所有数据类型都是对象

一    构造器

    function person(firstname,lastname,age,eyecolor)

    {

    this.firstname=firstname;

    this.lastname=lastname;

    this.age=age;

    this.eyecolor=eyecolor;

    }

    var a = new person("123", "123", 15, "red");

    js，面向对象语言，但不使用类

    不会创建类，也不通过类来创建对象

    js基于属性，而不是基于类的

二     数字

    1.js数字均为64位

    2.整数最多15位，小数最多17位

    3.前缀位0，八进制；前缀位0x，十六进制

三     字符串，数组，Data，Boolean，Math

    这些用到现查

    没有什么特殊的

四     RegExp正则

    用于规定在文本中检索的内容。

    var patt1=new RegExp("检索目标");//检索目标

    patt1.test("The best things in life are free");//检查字符串中的指定值，返回true、false

    patt1.exec("The best things in life are free");//一样是检索，不过返回的是被查找的值，没有书null

    patt1.compile("d");//改变检索目标

    var patt1=new RegExp("e","g");//第二个参数，表示要查找目标所有的关键词

    do

    {

        result=patt1.exec("The best things in life are free");

        document.write(result);

    }

    while (result!=null)

//未完待续

JS基础学习（一）的更多相关文章

  1. JS基础学习——对象

    JS基础学习--对象 什么是对象 对象object是JS的一种基本数据类型,除此之外还包括的基本数据类型有string.number.boolean.null.undefined.与其他数据类型不同的 ...

  2. JS基础学习——闭包

    JS基础学习--闭包 什么是闭包 闭包的定义如下,它的意思是闭包使得函数可以记住和访问它的词法范围,即使函数是在它声明的词法范围外执行.更简单来讲,函数为了自己能够正确执行,它对自己的词法范围产生闭包 ...

  3. JS基础学习——作用域

    JS基础学习--作用域 什么是作用域 变量的作用域就是变量能被访问到的代码范围,比如在下面的这个js代码中,变量a的作用域就是函数foo,因此在全局作用域内的console.log(a)语句不能访问到 ...

  4. JS 基础学习随想

    2012年就已经接触过了js,给我的印象:这是一门谈不上复杂的语言．大概这就是所谓的学的越浅,用的越少,觉得自己会的东西好像得更多吧!开始做基础练习题的时候觉得好像都十分简单．可是后来在做到对象数组的 ...

  5. handlebars.js基础学习笔记

    最近在帮学校做个课程网站,就有人推荐用jquery+ajax+handlebars做网站前端,刚接触发现挺高大上的,于是就把一些基础学习笔记记录下来啦. 1.引用文件: jquery.js文件下载:h ...

  6. JS基础学习1

    1 JS 概述 一个完整的javascript实现是由以下3个不同部分组成的: (1)     核心(ECMAscript) (2)     文档对象模型(DOM)  Document object ...

  7. JS基础学习篇（一）

    近来一直在学习js和jquery.刚刚进入前端工作还没有多久,虽然大学里学习的是编程自认为也学的还可以,但前端接触的不多,一直认为前端十分简单.其实不然,特别是工作的时候要自己设计一个完整的项目前端, ...

  8. Node.js基础学习四之注册功能

    前言:在Node.js学习(二)和(三)中介绍了如何在Node.js 中获取登录的用户名和密码与数据库进行验证并返回数据给客户端 需求:实现注册功能 为了区分登录和注册是两个不同的请求,在端口后面加上 ...

  9. 两万字Vue.js基础学习笔记

    Vue.js学习笔记 目录 Vue.js学习笔记 ES6语法 1.不一样的变量声明:const和let 2.模板字符串 3.箭头函数(Arrow Functions) 4. 函数的参数默认值 5.Sp ...

  10. JS基础学习（二）

    昨天把网站上的基础知识看完了,下面是剩下的部分 第六节 JS Window浏览器对象模型 JavaScript全局对象,函数,变量均自动成为window对象的成员. 1.Window对象 1.获取浏览 ...

随机推荐

  1. 10个常见的Node.js面试题

    如果你希望找一份有关Node.js的工作,但又不知道从哪里入手评测自己对Node.js的掌握程度. 本文就为你罗列了10个常见的Node.js面试题,分别考察了Node.js编程相关的几个主要方面. ...

  2. Python批量扫描服务器指定端口状态

    闲来无事用Python写了一个简陋的端口扫描脚本,其简单的逻辑如下: 1. python DetectHostPort.py iplist.txt(存放着需要扫描的IP地址列表的文本,每行一个地址) ...

  3. RF Firefox Profile

    默认情况下,robot framework是启动不带任何配置信息的firefox,如果需要启动带有profile的话,增加一个参数即可,如 Open Browser https://aws-qa5.i ...

  4. 常用HTTP状态码和CURL 000问题

      最近在测试CDN服务质量问题,测试过程中返回了一些不同的状态码,当然有一些常用的,也有一些不常用的.最奇葩的是在使用curl命令的时候出现000状态码,问了很多同事,对这个000的反应跟新事物是的 ...

  5. 报错：init: Could not find wglGetExtensionsStringARB!

    如下操作即可恢复:

  6. .net core教程

    https://docs.microsoft.com/en-us/aspnet/core/tutorials/first-mvc-app/start-mvc

  7. 关于LESS

    LESS 是动态的样式表语言,通过简洁明了的语法定义,使编写 CSS 的工作变得非常简单. 翻译成大白话:写CSS算是体力活,并没有编程的感觉,不给前端人员装逼的机会,于是就搞了这玩意,相当于编程写C ...

  8. SQL Server性能计数器收集汇总方案（Reporting Service）

    通过收集计数器信息,并将计数器信息汇总为不同粒度存储,以Reporting Service报表服务器显示.以下是计数器收集汇总的基本架构. 笔者需要收集的SQL Server计数器包括:SQL Ser ...

  9. 常用Linux命令收集

    关闭 php-fpm: ps -ef | grep php-fpm  或    ps aux | grep php-fpm kill -USR2 32253  (对应的进程PID) kill -9 进 ...

  10. Jquery客户端校验——jquery.validate.js

    jQuery Validate 插件为表单提供了强大的验证功能,让客户端表单验证变得更简单,同时提供了大量的定制选项,满足应用程序各种需求.该插件捆绑了一套有用的验证方法,包括 URL 和电子邮件验证 ...