初学javascript之引入javascript脚本代码到html中的4个方法
2013-06-08 23:16
489 查看
最近自己在学javascript，所以想把自己的一些小小的总结贴出来，以便日后复习，也希望对大家有所帮助 (*^__^*) 嘻嘻……
方法1.通过<script></script>标记对
在我们的源代码中<scipt></script>之外的部分是基本的html代码，<script></script>之间的是嵌入的是javascript封装的脚本代码
实例：
<html>
<head>
<meta http-equiv=content-type="test/html;charset=gb2312">
<title>Sample Page!</title>
</head>
<body>
<br>
<center>
<script language="javascript 1.2" type="text/javascript">
document.write("hello world!");
</script>
</center>
</body>
</html>
这里标记对<script></script>将javascript代码封装，并告知浏览器标记对中间的代码就是javascript脚本代码啦，然后调用了document文档对象中的write(),将字符串"hello world!"写入HTML文档中。
几个重要属性：
1）language属性：用于指定封装代码的脚本语言以及版本，几乎所有的浏览器都支持javascript（极老的浏览器除外）,同时language属性默认为javascript，因此如果你选择的封装语言为javascript，可以默认不设置。
2）type属性：指定<script></script>标记对中间插入的脚本代码的类型
3）src属性：用于将外部的脚本文件内容嵌入当前文档中，一般在较新的浏览器中，使用javascript脚本编写的外部脚本的扩展名必须是.js，同时<script></script>中不能有任何内容。
示例：
<script language = "JavaScript” type="text/javascript" src="Sample.js">
</script>
访法2：通过<script>标记的src属性引入
实例：test.html
<html>
<head>
<meta http-equiv=content-type="test/html;charset=gb2312">
<title>Sample Page!</title>
</head>
<body>
<br>
<center>
<script language="javascript 1.2" type="text/javascript"
src="1.js" >
</script>
</center>
</body>
</html>
并在文本编辑器中编辑
document.write("hello world!");
存为1.js
将test.html和1.js存在一个文件夹中，双击test.html运行结构跟方法1相同。
方法3：伪URL引入javascript
在多数浏览器中可以通过伪URL地址调用语句来引入javascript脚本代码。伪URL地址的一般格式如下：
javascript:alert("Hello World")
一般以javascript开始，后面紧跟要执行的操作。
示例：
<html>
<head>
<meta http-equiv=content-type="test/html;charset=gb2312">
<title>Sample Page!</title>
</head>
<body>
<br>
<center>
<p>伪URL引入javascript脚本实例:</p>
<form name = "MyForm">
<input type=text name="MyText" value="鼠标点击"
onclick="JavaScript:alert('鼠标已点击')">
</form>
</center>
</body>
</html>
伪URL地址可以用于文档的任何地方，并触发任意数量个javascript函数，常用表单合法性验证。
方法4：通过HTML文档事件处理程序引入
web开发时，可以给HTML文档中设定各种不同的事件处理器，通常设定某HTML元素（一个简单的动作或者函数）来引用一个脚本，属性一般以on开头。
示例：
<html>
<head>
<meta http-equiv=content-type="test/html;charset=gb2312">
<title>Sample Page!</title>
<script language="javascript" type="text/javascript">
function ClickMe()
{
alert("鼠标已点击按钮");
}
</script>
</head>
<body>
<br>
<center>
<p>通过文档事件处理程序引入javascript脚本实例:</p>
<form name = "MyForm">
<input type=button name="MyButton" value="鼠标单击"
onclick="ClickMe()">
</form>
</center>
</body>
</html>
方法1.通过<script></script>标记对
在我们的源代码中<scipt></script>之外的部分是基本的html代码，<script></script>之间的是嵌入的是javascript封装的脚本代码
实例：
<html>
<head>
<meta http-equiv=content-type="test/html;charset=gb2312">
<title>Sample Page!</title>
</head>
<body>
<br>
<center>
<script language="javascript 1.2" type="text/javascript">
document.write("hello world!");
</script>
</center>
</body>
</html>
这里标记对<script></script>将javascript代码封装，并告知浏览器标记对中间的代码就是javascript脚本代码啦，然后调用了document文档对象中的write(),将字符串"hello world!"写入HTML文档中。
几个重要属性：
1）language属性：用于指定封装代码的脚本语言以及版本，几乎所有的浏览器都支持javascript（极老的浏览器除外）,同时language属性默认为javascript，因此如果你选择的封装语言为javascript，可以默认不设置。
2）type属性：指定<script></script>标记对中间插入的脚本代码的类型
3）src属性：用于将外部的脚本文件内容嵌入当前文档中，一般在较新的浏览器中，使用javascript脚本编写的外部脚本的扩展名必须是.js，同时<script></script>中不能有任何内容。
示例：
<script language = "JavaScript” type="text/javascript" src="Sample.js">
</script>
访法2：通过<script>标记的src属性引入
实例：test.html
<html>
<head>
<meta http-equiv=content-type="test/html;charset=gb2312">
<title>Sample Page!</title>
</head>
<body>
<br>
<center>
<script language="javascript 1.2" type="text/javascript"
src="1.js" >
</script>
</center>
</body>
</html>
并在文本编辑器中编辑
document.write("hello world!");
存为1.js
将test.html和1.js存在一个文件夹中，双击test.html运行结构跟方法1相同。
方法3：伪URL引入javascript
在多数浏览器中可以通过伪URL地址调用语句来引入javascript脚本代码。伪URL地址的一般格式如下：
javascript:alert("Hello World")
一般以javascript开始，后面紧跟要执行的操作。
示例：
<html>
<head>
<meta http-equiv=content-type="test/html;charset=gb2312">
<title>Sample Page!</title>
</head>
<body>
<br>
<center>
<p>伪URL引入javascript脚本实例:</p>
<form name = "MyForm">
<input type=text name="MyText" value="鼠标点击"
onclick="JavaScript:alert('鼠标已点击')">
</form>
</center>
</body>
</html>
伪URL地址可以用于文档的任何地方，并触发任意数量个javascript函数，常用表单合法性验证。
方法4：通过HTML文档事件处理程序引入
web开发时，可以给HTML文档中设定各种不同的事件处理器，通常设定某HTML元素（一个简单的动作或者函数）来引用一个脚本，属性一般以on开头。
示例：
<html>
<head>
<meta http-equiv=content-type="test/html;charset=gb2312">
<title>Sample Page!</title>
<script language="javascript" type="text/javascript">
function ClickMe()
{
alert("鼠标已点击按钮");
}
</script>
</head>
<body>
<br>
<center>
<p>通过文档事件处理程序引入javascript脚本实例:</p>
<form name = "MyForm">
<input type=button name="MyButton" value="鼠标单击"
onclick="ClickMe()">
</form>
</center>
</body>
</html>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 
相关文章推荐
- 引入JavaScript脚本代码到HTML文档
- [Javascript]JS当前页面和框架自动刷新的方法[脚本代码大全]
- UpdatePanel触发javascript脚本的方法附代码
- JavaScript后台代码操作HTML TABLE的方法
- [Javascript]JS当前页面和框架自动刷新的方法[脚本代码大全]
- jsbeautifier + CScript/WScript/JavaScript 编程实现 JavaScript、HTML、CSS 代码格式化 js 脚本命令行工具 并集成到 EditPlus
- 嵌入JavaScript 脚本代码的位置对HTML的影响
- 刚编写了改html代码的 javascript小脚本 [原创]
- Jsp页面里引入一个javascript文件，在jsp的onclick里怎么添加脚本文件里的方法
- Html中编码格式的设置，及引入javascript、css的方法
- ASP.NET后台代码调用前台javascript脚本的方法
- 在winfrom下利用c#代码，实现kindEditor的JavaScript方法：editor.html()，实现上报窗体的自动提交。
- JavaScript 编程引入命名空间的方法与代码
- jsbeautifier + JScript.NET/JavaScript 编程实现 JavaScript、HTML、CSS 代码格式化脚本命令行工具 并集成到 EditPlus
- 伪URL地址引入JavaScript脚本代码实例
- 【原创】ASP.NET后台代码调用前台javascript脚本的方法
- javascript：js脚本的3中引入方法
- 通过文档事件处理程序引入JavaScript脚本代码实例
- [HTML][JavaScript]实用JavaScript脚本代码大全
- IE预览添加javaScript代码的本地Html文件后会弹出阻止脚本框问题