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

查看本章节

查看作业目录


需求说明:

  • 使用 JavaScript 的 HTML 页面混合、JavaScript 文件引用和 HTML 代码嵌入 3 种方式在 HTML 页面上打印出“点击我进入到百度首页”的超链接
  • 前 2 种方式点击超链接后进入到百度首页,最后一种方式点击超链接后打印出字符串:“跳转成功”

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

实现思路:

  1. 创建站点,新建HTML页面,在 HTML 页面的 <body>标签中编写 JavaScript 脚本,在脚本中输出超链接
  2. 在站点内创建一个 js 文件夹,在 js 文件夹内创建 JavaScript 文件,在 JavaScript 文件内编写脚本,在脚本中输出超链接
  3. HTML 页面中添加 <script> 标签,将 <script> 标签的 src 属性设置为步骤(2)中 JavaScript脚本文件的地址即可
  4. 在HTML 页面中,在 <body> 标签中添加一个超链接,超链接的目标地址使用 JavaScript 脚本输出

实现代码:

JS中的代码

document.write("<a href='http://www.baidu.com'>点击我跳转到百度首页</a>")
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<!-- 第二种方法,调用js/index.js -->
<script type="text/javascript" src="js/index.js"></script>
</head>
<body>
<br />
<!-- 第一种方法 -->
<script type="text/javascript">
document.write("<a href='http://www.baidu.com'>点击我跳转到百度首页</a>");
</script>
<br />
<!-- 第三种方法 -->
<a href="javascript:document.write('跳转成功')">点击我跳转到百度首页</a>
</body>
</html>
上一篇:JavaScript中,返回上一个页面时,如何保证上一个页面的不刷新?


下一篇:log4j:ERROR Failed to rename [/log/xxx.log] to [/log/xxx.log.2016-11-23.log]