在HTML中如何包含JavaScript?

种花家的守护者


这个问题,你算是问对人了。

Javascript其实可以写在HTML的任何位置,关键是怎么写。

1.1.1. Javascript可以写在script标签内(内嵌方式)

script type="text/javascript"

alert('这是Javascript程序');

/script

通过type属性告知浏览器标签内容是Javascript代码。

1.1.2. Javascript可以写在单独的文件中(外联方式)

1.创建以.js结尾的文件并且写入Javascript代码

2.hello.js(文件名任意):

alert('这是Javascript程序');

3.在html文件中使用Javascript代码文件

script type="text/javascript" src=’hello.js’/script

1.1.3. JavaScript可以写在HTML标签的事件属性中

onclick点击事件(用户点击),属性值:点击时,执行的js代码。

button onclick=” alert(250); ”点击我/button

用户点击,button的时候会提示250;

1.1.4. Javascript可以A标签的href属性中

a标签:超链接,主要用于跳转到href属性设置连接地址;

a href=”http://www.baidu.com”百度官网/a

a可以设置href值前缀以“javascript:”(前缀其实叫协议,例如:thunder://xxxfasdfasd,迅雷的协议,点击这样的连接打开的不是页面,而是迅雷)开头,当用户点击的时候就会告诉浏览器这不是一个连接地址,而是需要执行一段javascript代码。

a href=”javascript: alert(‘搞啥子???’);”点我/a

1.1.5.>

虽然script标签可以放在html标签的任何位置,但是为了网页的整体结构和开发人员多数的契约,我们应该放在如下两个位置:

a) 所有的script标签都应该放在页面的head标签中;

html

head

title文档标题/title

script src=”xxx” type=”xxx”/script

/head

/html

b) 为了让内容优先加载显示,提高用户体验,也可以把script标签放在/body结束标签之前。

html

head

title文档标题/title

/head

body

网页内容...........

网页内容...........

网页内容...........

script src=”xxx” type=”xxx”/script

/body

/html

1.1.6. 四种方式的区别和用法

区别:

1、内嵌方式的Javascript只能够在当前html文件中使用;

2、外联方式的js文件可以被多个html页面使用;

3、onclick是一个事件(发现什么什么后)属性,只有发现后才执行;

4、a标签本身是超链接,但是我们一旦指定javascript:协议后,点击这个超链接,就告诉浏览器需要执行一段javascript代码。与onclick一样都是点击后执行。

script标签选择:如果一个Javascript代码被多个html文件使用,请选择外联方式, 或者可以选择内嵌方式,策略与css一样。


教育路上行者何老师


在HTML中使用HTML需要借助<scirpt>标签,使用中包含JavaScript代码。/<scirpt>

  2、使用

-------------------------------------------

方法二:

把嵌入式的脚本添加到文档的

中, 不推荐这样做

--------------------------------------------

方法三:

把嵌入式的脚本添加到文档的

中, 维一的理由是要使用document.write()方法,但我们有更好方法来替代他.

如:createElement()方法, appendChild()方法, 非EMCAscript标准的 innerHTML属性 .

-----------------------------------------------

方法四:

非官方EMCA标准的 javascript: 前缀

可以成功打开一个新的窗口.

要注意window.open()方法是有返回值的, 原先的页面会被返回的结果覆盖.

地址栏变成:javascript:window.open('http://www.google.com');

页面内容变成:[object Window]

所在要再包一层function(), 做到无返回值.


大萝卜与小白兔


在最底部建在里面写。


分享到:


相關文章: