0

我正在尝试使用 JavaScript 中的 ActiveXObject（仅限 IE）从 Word 文档中提取图像。

我无法找到 Word 对象的任何 API 参考，只有来自 Internet 的一些提示：

var filename = 'path/to/word/doc.docx'
var word = new ActiveXObject('Word.Application')
var doc = w.Documents.Open(filename)
// Displays the text
var docText = doc.Content

我将如何使用类似的东西访问 Word 文档中的图像doc.Content？

此外，如果有人有 API 的明确来源（最好来自 Microsoft），那将非常有帮助。

4

1 回答 1

0

SaveAs因此，经过几周的研究，我发现使用Word ActiveXObject 的一部分功能最容易提取图像。如果文件保存为 HTML 文档，Word 将创建一个包含图像的文件夹。

从那里，您可以使用 XMLHttp 获取 HTML 文件并创建可由浏览器查看的新 IMG 标记（我使用的是 IE (9)，因为ActiveXObject 仅适用于 Internet Explorer）。

让我们从SaveAs部分开始：

// Define the path to the file
var filepath = 'path/to/the/word/doc.docx'
// Make a new ActiveXWord application
var word = new ActiveXObject('Word.Application')
// Open the document
var doc = word.Documents.Open(filepath)
// Save the DOCX as an HTML file (the 8 specifies you want to save it as an HTML document)
doc.SaveAs(filepath + '.htm', 8)

现在我们应该在同一目录中有一个文件夹，其中包含图像文件。

注意：在 Word HTML 中，图像使用<v:imagedata>存储在标签中的<v:shape>标签；例如：

<v:shape style="width: 241.5pt; height: 71.25pt;">
     <v:imagedata src="path/to/the/word/doc.docx_files/image001.png">
         ...
     </v:imagedata>
</v:shape>

我已经删除了 Word 保存的无关属性和标签。

要使用 JavaScript 访问 HTML，请使用 XMLHttpRequest 对象。

 var xmlhttp = new XMLHttpRequest()
 var html_text = ""

因为我正在访问数百个 Word 文档，所以我发现最好在发送调用之前onreadystatechange定义 XMLHttp 的回调。

// Define the onreadystatechange callback function
xmlhttp.onreadystatechange = function() {
    // Check to make sure the response has fully loaded
    if (xmlhttp.readyState==4 && xmlhttp.status==200) {
        // Grab the response text
        var html_text=xmlhttp.responseText
        // Load the HTML into the innerHTML of a DIV to add the HTML to the DOM
        document.getElementById('doc_html').innerHTML=html_text.replace("<html>", "").replace("</html>","")
        // Define a new array of all HTML elements with the "v:imagedata" tag
        var images =document.getElementById('doc_html').getElementsByTagName("v:imagedata")
        // Loop through each image
        for(j=0;j<images.length;j++) {
            // Grab the source attribute to get the image name
            var src = images[j].getAttribute('src')
            // Check to make sure the image has a 'src' attribute
            if(src!=undefined) {
                ...

我在加载正确src属性时遇到了很多问题，因为 IE 在将它们加载到 innerHTML div 时会转义它的 HTML 属性，doc_html因此在下面的示例中，我使用伪路径并src.split('/')[1]获取图像名称（此方法不会如果有超过 1 个正斜杠，则不起作用！）：

                ...
                images[j].setAttribute('src', '/path/to/the/folder/containing/the/images/'+src.split('/')[1])
                ...

在这里，我们使用父级（对象）的父级（恰好是一个对象）img向 HTML div 添加一个新标签。我们通过从图像中获取属性和从元素中获取信息来将新标签附加到 innerHTML ：v:shapepimgsrcstylev:shape

                ...
                images[j].parentElement.parentElement.innerHTML+="<img src='"+images[j].getAttribute('src')+"' style='"+images[j].parentElement.getAttribute('style')+"'>"

            }
        }       
    }
}
// Read the HTML Document using XMLHttpRequest
xmlhttp.open("POST", filepath + '.htm', false)
xmlhttp.send()

虽然有点具体，但上述方法能够成功地将 img 标签添加到 HTML 中它们在原始文档中的位置。

于 2013-03-08T00:57:39.777 回答