怎么打开手机上的html文件

html-css018

怎么打开手机上的html文件,第1张

android 浏览器

打开本地html文件的方法

有些html文件放在本地磁盘和sdcard,如何用打开这个网页呢?

这种应用在测试时非常有用。

有2个方法:

1. 使用文件管理器

如ES等,需要幸运的是你的文件管理器直接用浏览器打开。 

2. 在浏览器输入地址

访问本地磁盘和SD卡上的HTML,前部分content://com.android.htmlfileprovider是Provider的标准,后面是程序目录。 

比如sdcard的tesl.html

直接在浏览器里输入content://com.android.htmlfileprovider/sdcard/test.html回车就可以看到网页了。

在代码

webView.loadUrl("content://com.android.htmlfileprovider/sdcard/test.html")

如果是其它程序的私有html文件,这样做会失败。

这是由于com.android.htmlfileprovider的权限不够,如果是重写一个私有的HtmlProvider位于同一个应用中,应该能解决问题。然后就参考了原来的com.android.htmlfileprovider

源代码,改写了下。问题解决了,使用私有的HTMLProvider,可以轻松的访问手机内存中,程序私有目录下的html文件。

网上有例子,你可以搜索!

html格式打开的步骤如下:

1、html文件是一种超文本文件,也可以称为网页文件,查看的大部分网页都是html格式,要查看html网页,可以通过浏览器打开,在桌面选择浏览器,右键打开。

2、通过浏览器打开之后,可以看到html网页效果,有的时候html网页显示很乱,是因为没有找到css和js文件,需要将这些文件放在一起,html的网页才会出来。

3、最后就可以看到html文件内容,也可以通过记事本的方式打开,查看html代码,修改里面的内容,网页内容也会随之变化,这样打开html格式的问题就解决了。

在HTML5里,从Web网页上访问本地文件系统变的十分的简单,那就是使用File API。这个File规范说明里提供了一个API来表现Web应用里的文件对象,你可以通过编程来选择它们,访问它们的信息。这个File API包括:

一个FileList序列,代表着由本地系统里选中的单个的文件组成的数组。用来选择文件的用户接口可以通过<input type=”file”>调用实现。

一个Blob接口,它代表原始二进制数据,通过Blob对象你可以访问里面的字节数据。

一个File接口,它里面存有文件的只读属性信息,像文件名,文件类型,文件数据访问的地址。

一个FileReader接口,它提供了读取一个文件的方法,和一个获取文件读取结果的事件模型。

一个FileError接口和一个FileException对象,它们用来定义这个规范中的错误产生条件。

如何使用这个例子:在这个例子中,我给出了一个画板,你可以从本地文件系统里拖拽进去一个图片,或者你也可以用文件选择框来选择图片。例子中,请只选择图片文件,我并没有添加文件过滤和文件类型检查。请记住,没有一个浏览器完全实现了HTML5,这个例子需要在支持HTML5的浏览器上运行,比如Firefox3.5以上。 

实现File API的主要方法非常的简单,就像下面:

function imagesSelected(myFiles) { 

for (var i = 0, f f = myFiles[i] i++) { 

var imageReader = new FileReader() 

imageReader.onload = (function(aFile) { 

return function(e) { 

var span = document.createElement(‘span‘) 

span.innerHTML = ['<img class="images" src="', e.target.result,'" title="', aFile.name, '"/>'].join(”) 

document.getElementById(‘thumbs’).insertBefore(span, null) 

})(f) 

imageReader.readAsDataURL(f) 

function dropIt(e) { 

imagesSelected(e.dataTransfer.files) 

e.stopPropagation() 

e.preventDefault() 

}

选择在<td>上放置ondrop事件:

<td align=”left” height=”105″ ondragenter=”return false” ondragover=”return false” ondrop=”dropIt(event)”> 

<output id=”thumbs”></output> 

</td>