layui弹出窗口及其应用实例

一、弹出窗口

在引用JS、CSS的前提下

<button type="button" class="layui-btn" onclick="xadmin.open('班期添加','./banqi_add.aspx',600,600)">添加</button>

注意：必须包含type="button"，否则弹出的窗口会“一闪而过”。

二、关闭弹出层并刷新父窗口

1、使用jquery方式

$(function() {
//关闭弹窗
       $(document).on('click', '#closeBtn',
           function() {
            //先得到当前iframe层的索引  
          var index = parent.layer.getFrameIndex(window.name);
               parent.location.reload();//刷新父页面，注意一定要在关闭当前iframe层之前执行刷新
               parent.layer.close(index); //再执行关闭
          });
});

2、在asp.net中应用

在弹出的窗口添加数据，成功后弹出提示，点击关闭后，自动关闭弹窗，并刷新父窗口。

么是HTML / HTM文件？他们相差一个字母有什么区别吗，如何查看或编辑源代码以及如何转换成其他格式，例如DOCX，PDF，JPG 等，针对这些问题编程狮W3Cschool整理以下资料希望能对你有所帮助：

什么是HTM或HTML文件？

HTM / HTML 文件是超文本标记语言（Hyper Text Markup Language）文件，是 Internet 上的标准网页文件类型。

由于 HTM 文件是纯文本文件，因此它们仅包含文本（例如您现在正在阅读的内容）以及对其他外部文件的文本引用（例如本文中的配图）。

HTM 和 HTML 文件还可以引用其他文件，例如视频，CSS 或 JS 文件。

HTM与HTML的区别

HTM 与 HTML 没有本质意义的区别，只是为了满足 DOS 仅能识别 8+3 的文件名而已，因为一些老的系统 (win32) 不能识别四位文件名，所以某些网页服务器要求 index.html 最后一个 l 不能省略。MSIE 能自动识别和打开这些文件，但编写网页地址的时候必须是完全对应的，也就是说 index.htm 和 index.html 是两个不同的文件，对应着不同的地址。值得一提的是 UNIX 系统中对大小写敏感，不吻合的话就可能报没有文件或者找不到文件。

如何打开HTM或HTML文件？

任何 Web 浏览器，例如 Edge，Firefox，Chrome，Opera，IE，360 安全浏览器等，都可以打开并正确显示 HTM 和 HTML 文件。换句话说，在浏览器中打开这些文件并“解码（decode）” HTM 或 HTML 文件使其能正确显示。

现在有很多简化编辑和创建 HTM / HTML 文件的工具。一些著名的免费 HTML 编辑器包括 Eclipse ，Komodo Edit 和 Bluefish 。另一个流行的具有许多高级功能的 HTM / HTML 编辑器是 Adobe Dreamweaver ，不过它是收费的。

虽然 Windows 系统自带的记事本等简单的文本编辑器的功能不如专用的 HTM 编辑器那么丰富，但是对 HTM 或 HTML 文件进行简单编辑修改还是可以的。不过，W3Cschool还是建议大家使用专用的编辑器，如 WebStorm、VS Code 等，它具更多专业功能。

这是一个非常简单的 HTML 页面以文本形式显示的示例：

源码：

<!doctype html>
<html>

    
<head>
<meta charset="utf-8">
<title>什么是HTM或HTML文件？ - 编程狮(w3cschool.cn)</title>
</head>


<body>
    <h1>什么是HTM或HTML文件？</h1>
    <p>HTM / HTML 文件是超文本标记语言（Hyper Text Markup Language）文件，是 Internet 上的标准网页文件类型。</p>
    <p>由于 HTM 文件是纯文本文件，因此它们仅包含文本（例如您现在正在阅读的内容）以及对其他外部文件的文本*引用*（例如本文中的配图）。</p>
    <p>HTM 和 HTML 文件还可以引用其他文件，例如视频，CSS 或 JS 文件。</p>   
</body>

    
</html>

当 Web 浏览器呈现信息时，HTML 文件的源代码被“转换”为真实的网页（尽管源代码已很精简了）。

如何转换HTML和HTM文件？

HTM 文件以特定的语法（规则）构成，以使其中的代码和文本在浏览器中打开时能够正确显示。因此，将 HTM / HTML 文件转换为另一种格式可能会丢失页面上的所有功能。

如果你想要做的是将一个 HTM / HTML 文件转换为方便离线查看的文件，这时图片或 PDF 格式会方便很多。

在 Chrome 中，鼠标右键单击网页，出现的选项菜单中进入 “打印(P)...”(快捷键：CTRL + P) ，在打印选项中选择另存为 PDF，以将窗口中的页面转换为 PDF 文件。Chrome 浏览器的扩展功能也称为“全屏截屏”，可将 Chrome 浏览器中所有打开的 HTM / HTML 文件转换为 PNG 文件。

其他浏览器具有类似的功能，例如 Firefox 的 “另存为 PDF” 加载项。

您也可以使用专门用于 HTM / HTML 进行图像文件转换的网站，例如iWeb2Shot 或Web-capture 。

一个免费的文件转换器可以用来转换并保存 HTM / HTML 文件到您的计算机。如 FileZigZag 是一个免费的文档转换器网站，可将 HTM 转换为RTF，EPS，CSV，PDF 和许多其他格式。

HTM / HTML 文件不能转换为文本文件格式以外的任何格式。例如，HTML 文件永远不能转换为 MP3 音频文件。

文件打不开？

HTML / HTM 文件应该很容易打开，因为它们只是任何 Web 浏览器都可以查看的文本文件。如果您的文件没有从上面建议的任何程序打开，则很有可能正在打开的这个文件并非超文本标记语言文件。

某些文件格式使用的文件扩展名与 HTML / HTM 非常相似，但实际上并非相同。一个主要的示例是用于压缩 HTML 电子书文件的 HTMLZ 文件扩展名。有 HTML 文件在内的 HTMLZ 文件，但整个包的格式为 ZIP，不会在 Web 浏览器或文本编辑器打开。

在此示例中，您需要特定的 HTMLZ 文件查看器，例如Caliber 。或者，由于此文件格式实际上是存档，因此您可以使用 7-Zip 之类的文件解压缩器将其打开，然后您可以使用网络浏览器或上述任何其他 HTML 查看器/编辑器打开任何单独的 HTML 文件。

TMLANGUAGE 是另一个可能与 HTML / HTM 文件混淆的文件扩展名。这些实际上是TextMate 用于 macOS 的 TextMate 语言语法文件。

以上就是编程狮W3Cschool为你整理的关于《什么是HTM或HTML文件？如何打开、编辑和转换HTM和HTML文件？》的全部内容，现希望可以帮到你~

览器支持

所有主流浏览器都支持 <a> 标签。

标签定义及使用说明

<a> 标签定义超链接，用于从一个页面链接到另一个页面。

<a> 元素最重要的属性是 href 属性，它指定链接的目标。

在所有浏览器中，链接的默认外观如下：

未被访问的链接带有下划线而且是蓝色的
已被访问的链接带有下划线而且是紫色的
活动链接带有下划线而且是红色的

提示和注释

提示：如果没有使用 href 属性，则不能使用 hreflang、media、rel、target 以及 type 属性。

提示：通常在当前浏览器窗口中显示被链接页面，除非规定了其他 target。

提示：请使用 CSS 来改变链接的样式。

HTML 4.01 与 HTML5之间的差异

在 HTML 4.01 中，<a> 标签既可以是超链接，也可以是锚。在 HTML5 中，<a> 标签是超链接，但是假如没有 href 属性，它仅仅是超链接的一个占位符。

HTML5 有一些新的属性，同时不再支持一些 HTML 4.01 的属性。

属性

New ：HTML5 中的新属性。

属性	值	描述
charset	char_encoding	HTML5 不支持。规定目标 URL 的字符编码。
coords	coordinates	HTML5 不支持。规定链接的坐标。
downloadNew	filename	指定下载链接
href	URL	规定链接的目标 URL。
hreflang	language_code	规定目标 URL 的基准语言。仅在 href 属性存在时使用。
mediaNew	media_query	规定目标 URL 的媒介类型。默认值：all。仅在 href 属性存在时使用。
name	section_name	HTML5 不支持。规定锚的名称。
rel	alternateauthorbookmarkhelplicensenextnofollownoreferrerprefetchprevsearchtag	规定当前文档与目标 URL 之间的关系。仅在 href 属性存在时使用。
rev	text	HTML5 不支持。规定目标 URL 与当前文档之间的关系。
shape	defaultrectcirclepoly	HTML5 不支持。规定链接的形状。
target	_blank_parent_self_topframename	规定在何处打开目标 URL。仅在 href 属性存在时使用。
typeNew	MIME_type	规定目标 URL 的 MIME 类型。仅在 href 属性存在时使用。注：MIME = Multipurpose Internet Mail Extensions。

全局属性

<a> 标签支持 HTML 的全局属性。

事件属性

<a> 标签支持 HTML 的事件属性。

创建超级链接

本例演示如何在 HTML 文档中创建链接。

将图像作为链接

本例演示如何使用图像作为链接。

在新的浏览器窗口打开链接

本例演示如何在新窗口打开一个页面，这样的话访问者就无需离开您的站点了。

创建电子邮件链接

本例演示如何链接到一个邮件。（本例在安装邮件客户端程序后才能工作。）

创建电子邮件链接 2

本例演示更加复杂的邮件链接。

使用锚跳转到同一个页面的不同位置

本例演示如何使用锚的 id 属性跳转到页面的不同位置（ HTML5 不支持 name 属性）

如您还有不明白的可以在下面与我留言或是与我探讨QQ群308855039，我们一起飞！

在线咨询

上一篇：在 JS 中如何使用 Ajax 来进行请求
下一篇：PyScript：让Python在HTML中运行

您的项目需求

*请认真填写需求信息，我们会在24小时内与您取得联系。

整合营销服务商