使用 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 ...
随机推荐
- jenkins之邮箱设置
- SQL 父子表，显示表中每条记录所在层级
1.sqlserer 中有一张父子关系表,表结构如下: CREATE TABLE [dbo].[testparent]( [ID] [int] IDENTITY(1,1) NOT NULL, [nam ...
- 基于spring sringmvc mybatis 做的导入导出
导入 pom.xml <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://ww ...
- [MySQL实战-Mysql基础篇]-mysql架构
1.基本组成 下面是mysql的基本架构示意图 图一 图二 我们可以从图上看出,mysql大体分为两个部分,一个是server层,另一个是引擎层. server层中包含了连接器.查询缓存.分析器.优 ...
- 【C/C++】string的长度
一般用 s.length() s.size() 两种 size也可以用于vector string和vector的区别 string输入直接cin vector一般类似压栈pushback 输入一般是 ...
- 【Matlab】运算符使用整理 * .* / \ .'
[基本运算符] * :矩阵乘法or数与数相乘 .*:点乘,用于矩阵间对应元素的相乘,或数与数之间,数与矩阵之间的相乘. / :右除.a/b表示矩阵a乘以矩阵b的逆 \ :左除.a\b表示矩阵a的逆乘以 ...
- Kubernetes-存储(二)
前言 本篇是Kubernetes第十三篇,大家一定要把环境搭建起来,看是解决不了问题的,必须实战. Kubernetes系列文章: Kubernetes介绍 Kubernetes环境搭建 Kubern ...
- 报表（Project）
<Project2016 企业项目管理实践>张会斌 董方好 编著 好吧,今天这一篇,偷懒放水,不就是[报表]嘛,想看的话一个一个功能按钮点出来看就知道是咋肥四了,我就不一一截图了哈. 嗯, ...
- Spring Boot发布2.6.2、2.5.8：升级log4j2到2.17.0
12月22日,Spring官方发布了Spring Boot 2.5.8(包括46个错误修复.文档改进和依赖项升级)和2.6.2(包括55个错误修复.文档改进和依赖项升级). 这两个版本均为缺陷修复版本 ...
- AT2642 [ARC076A] Reconciled? 题解
Content 有 \(n\) 只狗和 \(m\) 只猴,现在要把这 \(n+m\) 只动物排成一排,要求相邻两只动物不能同时是狗或者同时是猴.求排列方案总数对 \(10^9+7\) 取模后的值. 数 ...