查看本章节

查看作业目录


需求说明:

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

实现思路:

  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 的 HTML 页面混合、JavaScript 文件引用和 HTML 代码嵌入 3 种方式在 HTML 页面上打印出“点击我进入到百度首页”的超链接的更多相关文章

  1. 几种方式实现Javaweb页面跳转

    背景:       自己经手的一个java项目要实现带参页面跳转和页面跳转,完成任务后,总结一下自己知道了的几种方式. 实现: 首先我们有两大种方式来实现页面跳转:1.JS(javascript):2 ...

  2. springmvc和servlet在上传和下载文件(保持文件夹和存储数据库Blob两种方式)

    参与该项目的文件上传和下载.一旦struts2下完成,今天springmvc再来一遍.发现springmvc特别好包,基本上不具备的几行代码即可完成,下面的代码贴: FileUpAndDown.jsp ...

  3. Django学习——ajax发送其他请求、上传文件(ajax和form两种方式)、ajax上传json格式、 Django内置序列化(了解)、分页器的使用

    1 ajax发送其他请求 1 写在form表单 submit和button会触发提交 <form action=""> </form> 注释 2 使用inp ...

  4. word HTML文件与Markdwon互相转换的几种方式

    Tip:word文件与Markdwon转换往往是可逆的.无论使用哪种方式,要想完美转换,必须要预先处理掉markdown与word不兼容的格式,如word文件对象,带边框的代码块等等 方法一:借助pa ...

  5. vue-router 路由传参的几种方式,刷新页面参数丢失

    常见场景:点击列表详情,跳转到详情内页,传递id参数获取详情数据. 我们先来看看路由跳转的几种方式: 1.通过params方式传参 通过$route.push的path携带参数方式 // 路由配置 { ...

  6. 模块化Javascript代码的两种方式

    1.将模块整体放在函数里 function buildMonthNameModule() { var names = ["January ", "February&quo ...

  7. CefSharp获取页面Html代码的两种方式

    CefSharp在NuGet的简介是“The CefSharp Chromium-based browser component”,机翻的意思就是“基于Cefsharp Chromium的浏览器组件” ...

  8. 如何将class文件打包成jar 这里提供两种方式!

    原地址:http://blog.163.com/09zzy@126/blog/static/711976652011101001530/ 如何将class文件打包成jar文件,这是一个很严肃的问题,当 ...

  9. Git设置文件或目录忽略跟踪的三种方式

    1. 共享的忽略设置方式 本地仓库根目录,创建.gitignore文件,并编辑正则匹配需要忽略的文件或目录. .gitignore文件需要上传到仓库,同时会影响到他人,共享忽略设置 注意: .giti ...

随机推荐

  1. 【C#代码实战】群蚁算法理论与实践全攻略——旅行商等路径优化问题的新方法

    若干年前读研的时候,学院有一个教授,专门做群蚁算法的,很厉害,偶尔了解了一点点.感觉也是生物智能的一个体现,和遗传算法.神经网络有异曲同工之妙.只不过当时没有实际需求学习,所以没去研究.最近有一个这样 ...

  2. oAuth 2.0 笔记

    OAuth 2.0规范于2012年发布,很多大型互联网公司(比如:微信.微博.支付宝)对外提供的SDK中,授权部分基本上都是按这个规范来实现的. OAuth 2.0提供了4种基本的标准授权流程,最为复 ...

  3. NodeJS中 package.json各属性分析

    package.json 中包含各种所需模块以及项目的配置信息(名称.版本.许可证等)meta 信息. Name:它属于必须字段,在package.json中最重要的就是name和version字段, ...

  4. realmswift的使用

    官网:https://realm.io/ 1.说下数据库迁移的问题: 在func application(application: UIApplication, didFinishLaunchingW ...

  5. ffmpeg-20160803-bin.7z

    ESC 退出 0 进度条开关 1 屏幕原始大小 2 屏幕1/2大小 3 屏幕1/3大小 4 屏幕1/4大小 S 下一帧 [ -2秒 ] +2秒 ; -1秒 ' +1秒 下一个帧 -> -5秒 f ...

  6. struts (三)

    1. <action name="test" class="com.gc.Test"> <result name="success& ...

  7. ArcGIS Desktop10.2与CityEngine2012兼容问题

    要培训ArcGIS Desktop和Esri CityEngine2012.在一台机器上装好Desktop10.2之后,在注册Esri CityEngine2012时报出了"7019:Inv ...

  8. Hibernate写入Oracle Date类型处理

    Hibernate写入Oracle数据库时,数据库设计字段为Date类型时,只能保存年月日,不能保存时分秒,如果要保存时分秒,需修改Hibernate.cfg.xml文件 <property n ...

  9. 记MSSQL数据库sa账号短时间密码失效问题

    在腾讯云服务器上安装了MSSQL2012,64位英文版本. sa账号的密码需要在一定时间内失效,无法访问.当时密码设置为admin@123. 最后修改了密码,改为比较复杂的密码,包含特殊字符,不包含a ...

  10. asp.net使用qq邮箱发送邮件

    using System; using System.Collections.Generic; using System.Linq; using System.Net; using System.Ne ...