Javascript 在html中的嵌入方式

Posted kaka666

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Javascript 在html中的嵌入方式相关的知识,希望对你有一定的参考价值。

Javascript 作为客户端的脚本语言,主要的用途就是帮助html处理部分交互逻辑。

Javascript语言同其他脚本语言一样,通过控制语句、函数、对象方法属性等来实现编程。

先来介绍javascript是如何同html交互的,也就是嵌入的方式。根据javascript在html中加载方式的不同,嵌入方式可以分为内部引用,外部引用和内联引用

 

1.    内部引用

通过<script></script>标记嵌入javascript,这是最常用也是最简便的一种引用方式。可以在html代码中的任何位置嵌入。

<head>

<script type=“text/javascript“>

Document.write(‘hello world!’);

 

</script>

</head>

 

2.    外部引用

通过引用html文件的方式加载javascript 文件,这种方式可以使用html代码更加简洁,方便代码复用。

<head>

<script type=”text/javascript”src=ga.js”></script>

</head>

标准加载方法是把javascript文件放到head标记内,但对于一些非关键的javascript文件,可以放到html文件底部,如一些流量统计代码。这样做可以提高网页访问速度,获得更好的用户体验,代码位置如下:

<script type = “text/javascript” src=”ga.js”></script>

</body>

<html>

 

 

3.    内联引用

通过html标记的触发事件属性实现,比如通过onclick事件直接调用javascript代码。在html中有很多这样的事件属性,通常都是配合javascript 这样的前端脚本语言来使用

<input type=”button” value =”” onclick= “alert(‘你内联引用的方式调用了javascript代码’);”>

 

以上代码会在页面生成一个按钮标记,当单击该按钮时会调用input标记的onlick属性,弹出一个提示框

 

 

以上是关于Javascript 在html中的嵌入方式的主要内容,如果未能解决你的问题,请参考以下文章

HTML里嵌入JavaScript方式中的脚本类型

HTML里嵌入JavaScript方式中的脚本类型

HTML 文本框,自动突出显示文本

JavaScript笔记--- JS概述;HTML中嵌入JS代码的三种方式

使用 JavaScript 的 HTML 页面混合JavaScript 文件引用和 HTML 代码嵌入 3 种方式在 HTML 页面上打印出“点击我进入到百度首页”的超链接

javascript是啥意思