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.内嵌式

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

2.外链式(外联式)

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

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

  • 语法: 在标签上写
  • 如:
<div onclick = "alert('点击了')"> </div>
  • 事件属性
    a.鼠标事件:

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

    b.键盘事件:

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

  • 语法:通过a标签
<a href="javascript:alert('你点击了')"></a>

注意事项:

1.内嵌式和外链式:
  • script标签上的type属性是一个可选值。
<script type="text/javascript">
    js代码
</script>

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属性为协议,<a href="javascript:js代码">文字</a>的方式

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

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

输出js代码的三种方式

1.网页中输出指定内容
  • 语法:
    document.write("输出内容");
    a. 可以输出中文、英文
    <script>
        document.write("今天天气也很不错")
    </script>

b.可以输出html代码

 <script>
        // document.write("今天天气也很不错");
        document.write(" <h2> 标题 </h2>")
 </script>

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

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

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

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 213,992评论 6 493
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 91,212评论 3 388
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 159,535评论 0 349
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 57,197评论 1 287
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 66,310评论 6 386
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,383评论 1 292
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,409评论 3 412
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,191评论 0 269
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,621评论 1 306
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,910评论 2 328
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,084评论 1 342
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,763评论 4 337
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,403评论 3 322
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,083评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,318评论 1 267
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,946评论 2 365
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,967评论 2 351

推荐阅读更多精彩内容

  • 为了一睹人杰地灵的阆中古城全貌,不到五点开始拾阶而上登白塔山。一路漆黑一片,心中有那么一点小小的不安,但耳边不知名...
    晴子晴天阅读 544评论 9 7
  • 云朵温柔的陷阱生来就带着烟火气高跟鞋代我说爱你诡异失真且俗气今晨的稻草堆扎得又是英俊四仰八叉的辫子头逆了时针,入了...
    梅凉阅读 652评论 4 14
  • 平时喜欢在简书上看有意思的文章,享受学习新知识新技术的过程。 很喜欢简书这样一个平台,可以让我在这里随便写点什...
    夏天不冷阅读 225评论 0 0
  • 原著:蒲松龄 白话:数峰无语 我姐夫的爷爷,宋公,名焘,是本县的秀才。一天,生病卧床,看见一名官吏拿着公文,牵着一...
    数峰无语阅读 1,172评论 0 0
  • 一页纸爱的故事——为你而歌 早春四月,每个傍晚的日光在一点点延长。树叶被夕阳镀上了一层金,凉爽的春风一吹,如粼粼闪...
    丁酱油阅读 340评论 1 1