YIXUNFE / blog

文章区
151 stars 25 forks source link

HTA, HTML Application #42

Open YIXUNFE opened 8 years ago

YIXUNFE commented 8 years ago

HTA, HTML Application

这年头,前端框架不支持移动原生应用开发都会让人觉得奇怪了。而使用前端技术开发桌面应用更是很早就有。大名鼎鼎的 node-webkit 就是其中一员。而我们今天要讲的,是 node-webkit 的爷爷辈老物 —— HTA,HTML 应用程序。


Hello world

编写 HTA 格外的简单,用一个文本文档,写上几句 HTML 语句,保存为 .hta 格式,双击即可运行。

<div>Hello world</div>

000

我们再来添加一些样式试试:

<style>.red {color: red}</style>
<div class=“red”>Hello world</div>

111

HTA 也支持 JS 脚本(VBScript,JScript):

<style>.red {color: red}</style>
<div class=“red”>Hello world</div>
<script>document.write('Wooo')</script>

222


HTA:Application 标签

既然是应用程序,应该是可以自己设定外观的,比如边框样式、应用程序图标、窗口最小化按钮等。这些设置都可以通过 <HTA:Application> 标签设置。

我来看个实例,将应用程序的边框去除:

<HTA:Application
  border="none"
>

因为去除边框后应用程序的最大化、最小化、关闭按钮就会一起消失,所以我们在页面中添加一个关闭按钮,可以防止程序无法从界面上被关闭。

<div onclick="self.close()">关闭</div>

3330


HTA:Application 标签中的属性列表

属性名 描述
applicationname 设置HTA的名称
border 设置边框类型,可选值有 thickdialog windownonethin
border-style 设置边框样式,可选值有 normalcomplexraisedstaticsunken
caption 设置是否显示标题栏或标题,默认值为 yes
icon 设置应用程序的图标
maximizebutton 设置是否显示最大化按钮,默认值为 yes
minimizebutton 设置是否显示最小化按钮,默认值为 yes
showIntaskbar 设置是否在任务栏中显示此应用程序,默认值为 yes
singleInstance 设置是否此应用程序同时只能运行一次,默认值为 no
sysmenu 设置是否在HTA窗口中显示系统菜单,默认值为 yes
version 应用程序的版本
windowstate 设置窗口的初始大小,可选值有 normalminimizemaximize
scroll 设置是否在右端显示竖向滚动条,默认值为 yes


结合 ActiveX 对象

在 HTA 中的复杂操作都离不开 ActiveX 对象,它提供了读写文件、访问数据库、调用其他程序等等功能。

这里我们尝试用 HTA 调出一个 notepad 程序。

<a onclick="callNotepad()">call notepad</a>
function callNotepad () {
  var shell = new ActiveXObject("WScript.Shell")
  shell.Run('notepad.exe', 3, true)
  shell = null 
}

想要制作一个功能强大的 HTA 应用就离不开 ActiveX 对象。今天就讲到这里,拜拜哦。


参考文章

【经验分享】本地脚本工具 -- Html Application

百度百科 - HTA


Thanks


yutingzhao1991 commented 8 years ago

张姿势了 原来还有这玩意。

cssmagic commented 8 years ago

Windows + Office + IE,以及底层的一堆技术,是一盘很大的棋呀。