javascript概念以及js四种引入方式和三种内容输出方式

js概念熟悉

首先了解一下编程语言

编程语言(programming language)(计算机语言)是人和计算机交流的一种语言。

编程语言的作用:

作用:
主要用于处理日常数据

其实,编程语言生活中无处不在,如使用的聊天软件

javaScript 简介

JavaScript概念:基于对象和事件驱动,并且具有相对安全性的解释型的客户端脚本语言

  • 具有面向对象能力:js一开始就是基于对象的一门语言,不像php从面向过程慢慢过渡到面向对象的,js中有很多内置对象,像window location对象...无须定义就可以使用。

  • 解释型:直接读代码而且运行,不像java,需要编译成一个点class文件,然后再执行那个class文件。

  • 事件驱动:js大部分操作是基于浏览器的,比如你要点击一下页面,点击一下这个按钮,鼠标选中这段文本才触发一段JavaScript代码的执行。

  • 相对安全性: 它没有一些修改文件和删除文件等一些恶意操作。(也是其魅力所在)

  • 客户端:不需要服务器端就能执行的 ,当你打开一个浏览器,打开一个网站,它的网页存放到你本地的临时空间,才去执行你的js代码。所以他是在本地执行的,所以叫客户端,服务端就不叫本地了,而是叫远程端

  • 脚本语言: 不像java需要一个JDK环境,还有.net需要一个SDK环境才能运行,他只是一个脚本语言,只需要支持他的浏览器即可,js是一种弱类型语言,浏览器内部已经内置了……

JavaScript是一门强大的编程语言,它既是一门非常简单的语言,又是一门非常复杂的语言。

此处,推荐两本书:犀牛书,javascript高级程序设计

Javascript的作用

  • 表单数据验证:表单数据验证是JavaScript最基本也是最能体现效率的功能。验证用户输入的信息是否符合要求,早期主要用于表单验证,在网络极差的时候。

  • 动态HTML(即DHTML):动态HTML指不需要服务器介入而动态变化的网页效果,包括动态内容、动态样式、动态布局等。通过js来判定屏幕的大小,使用js动态的实现css的引入。

  • 用户交互:用户交互指根据用户的不同操作进行的响应处理。例如:联动菜单等。三级联动菜单,鼠标hover上去的下拉菜单

  • 数据绑定:HTML中表单和表格能够以.txt文件定义的数据源,通过对位于服务器端的数据源文件的访问,便可以将数据源中的数据传送到客户端,并将这些数据保存在客户端。通过js引入数据,数组,json格式。

  • 少量数据查找:能够实现在当前网页中进行字符串的查找和替换。增删改查都可以。

  • AJAX核心技术:AJAX即异步JavaScript+XML。该对象提供一种支持异步请求的技术,使客户端可以使用JavaScript向服务器提出请求并处理响应,但并不影响用户在客户端的浏览。

实现js效果的两个步骤:

1.引入js代码
2.输出js的内容

js版本:ES5(指2014年以前的版本), ES6 , ES7(当前最新的版本)

四种引入js代码的方式

1.内嵌式

  • 语法:
  • 位置:网页中的任意位置
    写在body结束标签前,
    可以写在head标签内的script标签内

2.外链式(外联式)

  • 在外部创建一个.js的文件,里面写js代码
  • 语法:直接通过script标签的src属性引入.js的文件

3.在html标签中引入事件属性来绑定js代码

  • 语法: 在标签上写
  • 如:
  • 事件属性
    a.鼠标事件:

    • onclick:鼠标单击事件,
    • onmouseover:鼠标的移入事件,
    • onmouseout:鼠标的移出事件

    b.键盘事件:

4.使用a标签中href属性的伪协议操作:

  • 语法:通过a标签

注意事项:

1.内嵌式和外链式:
  • script标签上的type属性是一个可选值。

h5中默认值就是type="text/javascript",所以可以不写

  • script标签内只能写js代码

  • 不能在内嵌式中使用src属性

  • 外链式script标签内不能写js代码
    错误原因:外部引入的js代码会覆盖script标签里面的js代码,只显示外链式的js代码

  • js代码的引入位置
    a.一般都在head标签内
    b.可以写在body结束标签之前

  • 运用场景

    a.内嵌式主要用于测试
    b.外链式主要用于实际项目中

2.第三种和四种方式一般不使用

a.html标签内通过事件属性来绑定js代码,主要针对当前标签绑定js生效,必须通过事件来执行js文件

b.在a标签中href属性为协议,文字的方式

  • javascript:表示为协议,一般都使用小写

  • 写法:
    a.javascript:js代码
    b.javascript:void() 一般用于禁止a标签跳转。

输出js代码的三种方式

1.网页中输出指定内容
  • 语法:
    document.write("输出内容");
    a. 可以输出中文、英文
    

b.可以输出html代码

 

显示的结果是被h2修饰的标题

2.弹出框
  • 语法:alert("内容");
    字符串用引号引起来,变量不用引号。
3.在控制台中输出
  • 语法:
    console.log("文字"); 打印日志
    console.debug(""); 一般用于调试
    在控制台中输出是使用最多的方式。
输出js代码的作用:

编程中会产生很多相关数据,为了验证数据是否复合要求,必须通过输出的形式来查看数据的正确性

你可能感兴趣的:(javascript概念以及js四种引入方式和三种内容输出方式)