1.开发环境搭建

本系列教程的开发工具，我们采用HBuilder。

可以去网上下载最新的版本，然后解压一下就能直接用了。学习JavaScript，环境搭建是非常简单的，或者说，只要你有一个浏览器，一个记事本就行了，不存在环境搭建的问题。而且，通过运行浏览器，立刻就能看到效果，这一点比较Java要方便很多。省去了很多繁杂的操作，如果你正打算转行从事程序猿这个职业，不妨以JavaScript为切入点，从而发现编程的乐趣。当你深刻理解了JavaScript的思想，其他任何面向对象的语言都是大同小异的。

2.JavaScript初探

2.1 基本概念

一个网页，一般来说，分为Html，css，还有JavaScript。如果说Html是网页的骨架，那么css就是它的的外衣。JavaScript则是一个网页的能源，就是专门负责让网页动起来的必不可少的因素。

2.2 基础核心

作为一门基于对象的语言，JavaScript也和其他任何一门面向对象的语言一样，有着对象的概念。其实，就我看来，我们很多人在学习的过程中，都情不自禁地把简单的东西复杂化了，总想着去归类，最后把PPT做得很漂亮，理论说起来一套一套的。大纲弄得有模有样，条理清清楚楚，任何教科书，培训基本都是如此。其实在我看来，没必要搞得这么复杂，一下子弄这么多，我也记不住啊，难道你就非得拿着一本字典跟我一页一页地讲嘛？。JavaScript学习，无非都是围绕着对象和属性两个方面来兜圈子罢了。万变不离其宗。

在Javascript中，能点出来的，或者中括号里面的必然是属性（方法）。当然，数组不算在列。

对象调用属性。

对象调用属性。

对象调用属性。

整个Javascript其实翻来覆去都在围绕这个事情做文章。

在今后的学习过程中，我会反复强调这个事情，因为大家的时间都很宝贵，所以我打算把重要的东西反复讲，讲到你理解为止。一遍不行就说两遍，两遍不行说三遍，直到你明白JavaScript其实就是这么回事。

当你能够卸去对新东西的恐惧之后，然后才会逐渐掌握主动权，从而更加深入地学习它。

我很明白，包括当初的我自己也是如此，因为不懂，所以害怕去学，怕受打击。

比如Javascript，看了半天看不懂，网上找的资料也不明白是什么意思，买一本教材吧，看得我都快怀疑人生了，心想怎么这么深奥啊。

后来发现，仅仅是因为我的不自信，不敢跨出第一步！

如果你是初学者，请先从编写很烂的代码开始，不要害怕被嘲笑，先去做，踏出第一步再说！

然后，你会渐渐发现乐趣的，只要你不断地总结，不断地总结，总有一天，你会有一种感觉的。就是一种仿佛什么事情都难不住你的感觉，这并非你自信心膨胀，而是你勇敢踏出了第一步之后，获得的内功积累。

当你真的去做了之后，你就会发现，没那么难，而且你会越学越有乐趣。

2.3 小案例 - 制作一个按钮

代码：

<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8">

        <title>我的第一个html页面</title>

        <style type="text/css">

            .btn {

                height: 30px;

                width: 100px;

                background: #0c093e;

                color:#fff;

                font-family: "微软雅黑";

                border-radius: 5px;

                text-align: center;

                line-height: 30px;

                position: absolute;

                left: 50%;

                margin-left: -50px;

                top: 50%;

                margin-top: -15px;

                cursor: pointer;

                transition: background 1s ease;

            }

            .btn:hover{

                background: #251f8c;

            }

        </style>

    </head>

    <script type="text/javascript">

        /*var person = {

            name : "zhangsan"

        }

        person.name = "lisi";

        person.name = "wangwu"

        alert(person.name);*/

        window['onload'] = function(){

            //alert(1);

            //1. 获取按钮的dom元素

            var btn = document.getElementsByTagName('div')[0];

            btn.onclick = function(){

                alert('保存成功！');

            }

        }

        /*window.onload = function(){

            alert(2);

        }*/

        /*

         *  A 1

         *  B 2

         *  C 1,2

         *  D 报错

         *

         * */

    </script>

    <body>

        <div class='btn'>

            保存

        </div>

    </body>

</html>

开发工具包：http://pan.baidu.com/s/1bo6VzbD

视频地址：http://pan.baidu.com/s/1jHUxLPW

JavaScript学习（一） —— 环境搭建与JavaScript初探的更多相关文章

  1. hive_学习_01_hive环境搭建(单机)

    一.前言 本文承接上一篇:hbase_学习_01_HBase环境搭建(单机),主要是搭建 hive 的单机环境 二.环境准备 1.说明 hive 的下载来源有: 官方版本:http://archive ...

  2. hbase_学习_01_HBase环境搭建(单机)

    一.前言 本文承接上一篇:hadoop_学习_02_Hadoop环境搭建(单机)  ,主要是搭建HBase的单机环境 二.环境准备 1.说明 hbase 的下载来源有: 官方版本:http://arc ...

  3. hadoop_学习_02_Hadoop环境搭建(单机)

    一.环境准备 1.说明 hadoop的下载来源有: 官方版本:http://archive.apache.org/dist/hadoop/ CDH版本:http://archive.cloudera. ...

  4. 从0开始学爬虫9之requests库的学习之环境搭建

    从0开始学爬虫9之requests库的学习之环境搭建 Requests库的环境搭建 环境:python2.7.9版本 参考文档:http://2.python-requests.org/zh_CN/l ...

  5. Ubuntu16.04深度学习基本环境搭建，tensorflow , keras , pytorch , cuda

    Ubuntu16.04深度学习基本环境搭建,tensorflow , keras , pytorch , cuda Ubuntu16.04安装 参考https://blog.csdn.net/flyy ...

  6. ubuntu 深度学习cuda环境搭建，docker-nvidia 2019-02

    ubuntu 深度学习cuda环境搭建 ubuntu系统版本 18.04 查看GPU型号(NVS 315 性能很差,比没有强) 首先最好有ssh服务,以下操作都是远程ssh执行 lspci | gre ...

  7. Python基础学习之环境搭建

    Python如今成为零基础编程爱好者的首选学习语言,这和Python语言自身的强大功能和简单易学是分不开的.今天我们将带领Python零基础的初学者完成入门的第一步——环境搭建.本文会先来区分几个在P ...

  8. 001-深度学习Pytorch环境搭建(Anaconda , PyCharm导入)

    001-深度学习Pytorch环境搭建(Anaconda , PyCharm导入) 在开始搭建之前我们先说一下本次主要安装的东西有哪些. anaconda 3:第三方包管理软件. 这个玩意可以看作是一 ...

  9. 人工智能之深度学习-初始环境搭建（安装Anaconda3和TensorFlow2步骤详解）

    前言: 本篇文章主要讲解的是在学习人工智能之深度学习时所学到的知识和需要的环境配置(安装Anaconda3和TensorFlow2步骤详解),以及个人的心得体会,汇集成本篇文章,作为自己深度学习的总结 ...

随机推荐

  1. .Net多线程编程—预备知识

    1 基本概念 共享内存的多核架构:一个单独的封装包内封装了多个互相连接的未处理器,且所有内核都可以访问主内存.共享内存的多核系统的一些微架构,例如内核暂停功能,超频. 内核暂停功能:当使用内核不多的时 ...

  2. 第一个shell脚本

    打开文本编辑器,新建一个文件,扩展名为sh(sh代表shell),扩展名并不影响脚本执行,见名知意就好. #!/bin/bash echo "Hello World !" &quo ...

  3. Android ViewPager打造3D画廊

    本文已授权微信公众号:鸿洋(hongyangAndroid)在微信公众号平台原创首发. 网上有很多关于使用Gallery来打造3D画廊的博客,但是在关于Gallery的官方说法中表明: This cl ...

  4. Spring中Bean的实例化

                                    Spring中Bean的实例化 在介绍Bean的三种实例化的方式之前,我们首先需要介绍一下什么是Bean,以及Bean的配置方式. 如果 ...

  5. spring applicationContext.xml和hibernate.cfg.xml设置

    applicationContext.xml配置 <?xml version="1.0" encoding="UTF-8"?> <beans ...

  6. 1.Hibernate简介

    1.框架简介: 定义:基于java语言开发的一套ORM框架: 优点:a.方便开发;           b.大大减少代码量;           c.性能稍高(不能与数据库高手相比,较一般数据库使用者 ...

  7. Hadoop伪分布式集群环境搭建

    本教程讲述在单机环境下搭建Hadoop伪分布式集群环境,帮助初学者方便学习Hadoop相关知识. 首先安装Hadoop之前需要准备安装环境. 安装Centos6.5(64位).(操作系统再次不做过多描 ...

  8. Android快乐贪吃蛇游戏实战项目开发教程-01项目概述与目录

    一.项目简介 贪吃蛇是一个很经典的游戏,也很适合用来学习.本教程将和大家一起做一个Android版的贪吃蛇游戏. 我已经将做好的案例上传到了应用宝,无病毒.无广告,大家可以放心下载下来把玩一下.应用宝 ...

  9. EChart系列：在echart3中使用百度地图扩展之后，如何获取到百度地图对象

    最近做项目想要在百度地图上叠加显示echart的散点图,然后根据地图的缩放等级和区域范围要显示不同的散点图,这中间折腾了好久.功能要求包括: (1)底图使用百度地图: (2)可以在地图上叠加显示ech ...

  10. 我的MYSQL学习心得（十） 自定义存储过程和函数

    我的MYSQL学习心得(十) 自定义存储过程和函数 我的MYSQL学习心得(一) 简单语法 我的MYSQL学习心得(二) 数据类型宽度 我的MYSQL学习心得(三) 查看字段长度 我的MYSQL学习心 ...