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. 数据库优化案例——————某市中心医院HIS系统

    记得在自己学习数据库知识的时候特别喜欢看案例,因为优化的手段是容易掌握的,但是整体的优化思想是很难学会的.这也是为什么自己特别喜欢看案例,今天也开始分享自己做的优化案例. 最近一直很忙,博客产出也少的 ...

  2. 使用python抓取婚恋网用户数据并用决策树生成自己择偶观

    最近在看<机器学习实战>的时候萌生了一个想法,自己去网上爬一些数据按照书上的方法处理一下,不仅可以加深自己对书本的理解,顺便还可以在github拉拉人气.刚好在看决策树这一章,书里面的理论 ...

  3. kafka配置与使用实例

    kafka作为消息队列,在与netty.多线程配合使用时,可以达到高效的消息队列

  4. 使用 Android Studio 检测内存泄漏与解决内存泄漏问题

    本文在腾讯技术推文上 修改 发布. http://wetest.qq.com/lab/view/63.html?from=ads_test2_qqtips&sessionUserType=BF ...

  5. 重新认识了下Entity Framework

    什么是Entity Framework Entity Framework是一个对象关系映射O/RM框架. Entity Framework让开发者可以像操作领域对象(domain-specific o ...

  6. VS15 preview 5打开文件夹自动生成slnx.VC.db SQLite库疑惑?求解答

    用VS15 preview 5打开文件夹(详情查看博客http://www.cnblogs.com/zsy/p/5962242.html中配置),文件夹下多一个slnx.VC.db文件,如下图: 本文 ...

  7. spider RPC入门指南

    本部分将介绍使用spider RPC开发分布式应用的客户端和服务端. spider RPC中间件基于J2SE 8开发,因此需要确保服务器上安装了JDK 8及以上版本,不依赖于任何额外需要独立安装和配置 ...

  8. BPM的魅力何在?

    BPM(Business Process Management , 企业流程管理平台) 是带动企业流程自动化的帮 手,也是最能忠实反应出企业作业流程问题症结的系统工具,在管理上,BPM可以让管理者利用 ...

  9. 我的MYSQL学习心得(二) 数据类型宽度

    我的MYSQL学习心得(二) 数据类型宽度 我的MYSQL学习心得(一) 简单语法 我的MYSQL学习心得(三) 查看字段长度 我的MYSQL学习心得(四) 数据类型 我的MYSQL学习心得(五) 运 ...

  10. 【Java并发编程实战】-----“J.U.C”:Phaser

    Phaser由java7中推出,是Java SE 7中新增的一个使用同步工具,在功能上面它与CyclicBarrier.CountDownLatch有些重叠,但是它提供了更加灵活.强大的用法. Cyc ...