使用 JavaScript 的 HTML 页面混合、JavaScript 文件引用和 HTML 代码嵌入 3 种方式在 HTML 页面上打印出“点击我进入到百度首页”的超链接
查看本章节
查看作业目录
需求说明：
- 使用 JavaScript 的 HTML 页面混合、JavaScript 文件引用和 HTML 代码嵌入 3 种方式在 HTML 页面上打印出“点击我进入到百度首页”的超链接
- 前 2 种方式点击超链接后进入到百度首页，最后一种方式点击超链接后打印出字符串：“跳转成功”
实现思路：
- 创建站点，新建HTML页面，在 HTML 页面的 <body>标签中编写 JavaScript 脚本，在脚本中输出超链接
- 在站点内创建一个 js 文件夹，在 js 文件夹内创建 JavaScript 文件，在 JavaScript 文件内编写脚本，在脚本中输出超链接
- HTML 页面中添加 <script> 标签，将 <script> 标签的 src 属性设置为步骤（2）中 JavaScript脚本文件的地址即可
- 在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 页面上打印出“点击我进入到百度首页”的超链接的更多相关文章
- 几种方式实现Javaweb页面跳转
背景: 自己经手的一个java项目要实现带参页面跳转和页面跳转,完成任务后,总结一下自己知道了的几种方式. 实现: 首先我们有两大种方式来实现页面跳转:1.JS(javascript):2 ...
- springmvc和servlet在上传和下载文件（保持文件夹和存储数据库Blob两种方式）
参与该项目的文件上传和下载.一旦struts2下完成,今天springmvc再来一遍.发现springmvc特别好包,基本上不具备的几行代码即可完成,下面的代码贴: FileUpAndDown.jsp ...
- Django学习——ajax发送其他请求、上传文件（ajax和form两种方式）、ajax上传json格式、 Django内置序列化（了解）、分页器的使用
1 ajax发送其他请求 1 写在form表单 submit和button会触发提交 <form action=""> </form> 注释 2 使用inp ...
- word HTML文件与Markdwon互相转换的几种方式
Tip:word文件与Markdwon转换往往是可逆的.无论使用哪种方式,要想完美转换,必须要预先处理掉markdown与word不兼容的格式,如word文件对象,带边框的代码块等等 方法一:借助pa ...
- vue-router 路由传参的几种方式，刷新页面参数丢失
常见场景:点击列表详情,跳转到详情内页,传递id参数获取详情数据. 我们先来看看路由跳转的几种方式: 1.通过params方式传参 通过$route.push的path携带参数方式 // 路由配置 { ...
- 模块化Javascript代码的两种方式
1.将模块整体放在函数里 function buildMonthNameModule() { var names = ["January ", "February&quo ...
- CefSharp获取页面Html代码的两种方式
CefSharp在NuGet的简介是“The CefSharp Chromium-based browser component”,机翻的意思就是“基于Cefsharp Chromium的浏览器组件” ...
- 如何将class文件打包成jar 这里提供两种方式！
原地址:http://blog.163.com/09zzy@126/blog/static/711976652011101001530/ 如何将class文件打包成jar文件,这是一个很严肃的问题,当 ...
- Git设置文件或目录忽略跟踪的三种方式
1. 共享的忽略设置方式 本地仓库根目录,创建.gitignore文件,并编辑正则匹配需要忽略的文件或目录. .gitignore文件需要上传到仓库,同时会影响到他人,共享忽略设置 注意: .giti ...
随机推荐
- Bitmaps与优化
1.有效的处理较大的位图 图像有各种不同的形状和大小.在许多情况下,它们往往比一个典型应用程序的用户界面(UI)所需要的资源更大. 读取一个位图的尺寸和类型: 为了从多种资源来创建一个位图,Bitma ...
- window安装ab压力测试
ab是Apache HTTP server benchmarking tool的缩写,可以用以测试HTTP请求的服务器性能,也是业界比较流行和简单易用的一种压力测试工具包 ## 下载 下载地址:(ht ...
- JDK的简介，卸载和安装过程
JDK的简介,卸载和安装过程 JDK JRE JVM JDK:Java Development Kit JRE:Java Runtime Environment JVM:Java Virtual Ma ...
- numpy基础教程--clip函数的使用
在numpy中,clip函数的原型为clip(self, min=None, max=None, out=None),意思是把小于min的数全部置换为min,大于max的数全部置换为max,在[min ...
- 强化学习实战 | 表格型Q-Learning玩井字棋（四）游戏时间
在 强化学习实战 | 表格型Q-Learning玩井字棋(三)优化,优化 中,我们经过优化和训练,得到了一个还不错的Q表格,这一节我们将用pygame实现一个有人机对战,机机对战和作弊功能的井字棋游戏 ...
- python3.6.4 scrapy框架from PIL import Image报错 from . import _imaging as core
scrapy框架爬取url下载图片时,用ImagesPipeline下载图片 from PIL import Image报错 from . import _imaging as core Import ...
- Hadoop期末复习
Hadoop期末复习 选择题 以下选项中,哪个程序负责HDFS数据存储. B A.NameNode B.DataNode C.Secondary NameNode D.ResourceManager ...
- py脚本 获取当前运行服务的相关信息
一.简介 最近在统计系统中都部署了什么服务,但服务器太多,在没有标准化之前进行整理,还是写脚本收集方便一些. 当然还是需要人工去判断整理表格,为后面标准化做准备.脚本是python2.7的,默认的ce ...
- 纯css设置元素高度与宽度相等
设置图片高度等于宽度 .img-box{ width:100%; height:0; position: relative; padding-bottom: 100% } .img-box img{ ...
- 我在这里的处女篇（Word技巧集团）
传说这里的文章可以在Word上打好了发布,Word嘛,有[听写]功能,不用打字了: 写好的文章还可以[大声朗读],边听边看最容易找"通假字"了. 冲这,我的新阵地就定这里了,哈哈~