对未来的恐慌,和想成为一名自由开发的梦想。让我觉得应该点亮一个新的技能:WEB前端开发。

重新学习JS以及jQuery,让我在日常code的过程中可以更得心应手,毕竟,我爱代码。

这篇文章主要记录的内容是JS相关的基本指令,只有基本内容,没有理论分析。比较深的理论知识会在后续的文章中进行对比分析。

和HTML以及CSS一样,JS也是一个纯文本语言,不需要用新的工具来编译,创建一个新的记事本,把记事本的格式改成js即可。

按照学习语言的惯例。从Hello world!开始。

首先,创建一个hello.js的文件,内容如下:

var message;
message = 'Hello world!';
document.write(message);

接下来,在同一个文件夹下创建一个名为hello.html的文件,内容如下:

<!DOCTYPE html>
<html>
<head><title><h1>HELLO</h1></title></head>
<body>
<script src = "hello.js"></script>
</body>
</html>

通过运行html文件,通过<script src = "hello.js"></script>调用js文件,出现message中的内容。

知识点来了:

1.js文件是大小写敏感的,如果在编写的过程中出现大小写不一致,就得不到想要的效果。可以通过直接打开JS文件来查看是否有语法错误。

2.在浏览页面的时候,右击鼠标,选择“检查源代码”,会发现显示的只是js文件的路径。如果没有出现想要的效果,排除了语法错误,可以双击路径,看是否是路径描述错误。

3.DOCUMENT对象:document对象表示整个Web界面。write()方法可以将新内容写入页面调用<script>标签的地方。

在页面出现了Hello world,迈出学习js的第一步。

因为是Web开发的初学者,而且全靠自学,如果在博客内容中出现了过时的标签和属性。希望大家不吝指点。本人不胜感激。

JS学习记录------JS基本指令的更多相关文章

  1. vue.js学习记录

    vue.js学习记录 文章已同步我的github笔记https://github.com/ymblog/blog,欢迎大家加star~~ vue实例 生命周期 beforeCreate:不能访问thi ...

  2. 我的three.js学习记录(二)

    通过上一篇文章我的three.js学习记录(一)基本上是入门了three.js,但是这不够3D,这次我希望能把之前做的demo弄出来,然后通过例子来分析操作步骤. 1. 示例 上图是之前做的一个dem ...

  3. 我的three.js学习记录(三)

    此次的亮点不是three.js的3d部分,而是通过调用摄像头然后通过摄像头的图像变化进行简单的判断后进行一些操作.上篇中我通过简单的示例分析来学习three.js,这次是通过上一篇的一些代码来与摄像头 ...

  4. D3.js学习记录【转】【新】

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. 我的three.js学习记录(一)

    在之前因为项目需要使用WebGL技术做网页应用,但是苦于自己没有接触,只是使用过OpenGL.然后接触到了thre.js这个第三方库之后我突然心情很愉快,这将节省我很多时间. 过了这个项目之后,就再也 ...

  6. Js 框架之Vue .JS学习记录 ① 与Vue 初识

    目录 与 Vue.js 认识 VUE.JS是个啥?有啥好处? Vue 的目标 战前准备  VUE.JS环境 VUE.JS 尝试一下,你就明白 第一步 实例化VUE 对象 第二步VueAPP 调用数据 ...

  7. python , angular js 学习记录【1】

    1.日期格式化 Letter Date or Time Component Presentation Examples G Era designator Text AD y Year Year 199 ...

  8. css,js 学习记录

    记录一些自己曾经阅读,值得收藏的网址 --(css3新特性) https://segmentfault.com/a/1190000010780991#articleHeader41 --CSS3 3D ...

  9. D3.js学习记录

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. C语言博客作业5--指针

    C语言博客作业5--指针 1.本章学习总结(2分) 1.1思维导图 请以思维导图总结本周的学习内容,如下图所示: 1.2本章学习体会及代码量学习体会 1.2.1学习体会 描述本周学习感受,也可以在这里 ...

  2. 正确的学python方式

    首先呢,和其他的各种学习都一样,你一定要明白你学习的目标是什么.有的人想要通过学习Python,转行成程序员,实现行业上的转变:有的人希望通过学习Python,在现有的岗位上提升自己:当然也有很多人只 ...

  3. 提取和匹配线特征的一个demo

    一.代码来源: https://github.com/drozdvadym/opencv_line_descriptor 二.依赖包:OpenCV 2.4.9 三.Matching的运行结果截图: 四 ...

  4. Android 开发 Activity里获取View的宽度和高度 转载

    原文地址:https://blog.csdn.net/chenbaige/article/details/77991594 前言: 可能很多情况下,我们都会有在activity中获取view 的尺寸大 ...

  5. Android 开发 记录一个DP、PX、SP转换工具类

    public class UnitConversionUtil { /** * 根据手机分辨率从DP转成PX * @param context * @param dpValue * @return * ...

  6. ensureCapacity增加此 ArrayList 实例的容量,以确保它至少能够容纳最小容量参数所指定的元素数。

    扩容原则: 若参数值大于底层数组长度的1.5倍,则数组的长度就扩容为这个参数值:若小于底层数组长度的1.5倍,则数组长度就扩容为底层数组长度的1.5倍. ensureCapacity提高效率 fina ...

  7. Django中的视图(view)

    视图 1.什么是视图 视图就是Django项目下的view.py文件,它的内部是一系列的函数或者是类,用来专门处理客户端访问请求后处理请求并且返回相应的数据,相当于一个中央情报处理系统 2.具体视图实 ...

  8. SQL Server 2016 在Windows Server 2012 R2 上的初步安装与远程连接实战(一):初步配置

    1.安装过程没有什么说头 2.下载并安装SSMS(SQLServer Management Studio),目前已更新到2017.1 3.使用SSMS登陆数据库 第一次选择Windows 身份验证,可 ...

  9. 快速干掉Windows Defender

    1.快捷键Win+R,调出"运行"对话框,输入"gpedit.msc",打开组策略编辑器: 2.展开"计算机配置"→"管理模板&q ...

  10. 简单搭建一个SpringBoot

    1.SpringBoot下载 https://start.spring.io/ 选择工程类型,编译语言,版本,工程名称,需要支持组件等:选择好了以后点击生成项目. 之后会下载一个压缩文件,解压之后导入 ...