简体   繁体   English

带有隐藏元素的document.execCommand ..SaveAs问题。

[英]document.execCommand ..SaveAs issue with hidden elements.,

document.execCommand('SaveAs', false,'fileName' + ".txt"); document.execCommand('SaveAs',false,'fileName'+“ .txt”);

I am trying to save the page in a file by using the above command in javascript. 我正在尝试使用javascript中的上述命令将页面保存到文件中。

Issue: I have some hidden elements on the page..CSS Style [display:none], So when I try to save the pages content using the above command, it writes the hidden elements contents as well. 问题:页面上有一些隐藏元素。CSS样式[display:none],因此当我尝试使用上述命令保存页面内容时,它也会写隐藏元素的内容。

Any ideas how to get rid of the hidden elements content. 任何想法如何摆脱隐藏元素的内容。 Is there any other parameter that we can pass which will tell not to save the hidden elements content., 我们是否可以传递其他任何参数,以告知不要保存隐藏元素的内容,

Any help is appreciated. 任何帮助表示赞赏。

PS: I dont want to remove the hidden elements content from DOM. PS:我不想从DOM中删除隐藏的元素内容。 Its not an option. 这不是一个选择。

Thanks, Ben 谢谢,本

Does anyone has any other answers.. 有人有其他答案吗?

Here's what I came up with 这是我想出的

Clone the document, then remove all nodes with the class name which specifies it as hidden, or as content that you don't want saved. 克隆文档,然后删除所有类名称都指定为隐藏或不想保存的内容的节点。 In my case I used the class name 'hidden'. 在我的情况下,我使用了类名“ hidden”。 removeElementsByClass goes through the cloned document and removes all the bad nodes. removeElementsByClass遍历克隆的文档并删除所有不良节点。 Now run the exec on the object newDoc, saving this cloned and reduced document. 现在,在对象newDoc上运行exec,保存此克隆并精简的文档。

var newDoc = document.getElementsByTagName("html")[0].cloneNode(true);
removeElementsByClass(newDoc, 'hidden');
newDoc.execCommand('SaveAs', false,'fileName' + ".txt");

function removeElementsByClass(object, class)
{
    var elementArray  = [];
    if (object.all)
    {
        elementArray = object.all;
    }
    else
    {
        elementArray = object.getElementsByTagName("*");
    }

    var matchedArray = [];
    var pattern = new RegExp("(^| )" + class + "( |$)");

    for (var i = 0; i < elementArray.length; i++)
    {
        if (pattern.test(elementArray[i].className))
        {
                elementArray[i].parentNode.removeChild(elementArray[i]);
        }
    }
}

Untested... but my only thought would be to: 未经测试...但我唯一的想法是:

  • wrap the call... 结束通话...
  • save a variable with a "pure" copy of the entire DOM... 使用整个DOM的“纯”副本保存变量...
  • strip out the hidden elements eg removeChild() where the display:none is set 去除隐藏的元素,例如removeChild(),其中display:none被设置
  • execute the save 执行保存
  • reset the DOM to the original 将DOM重置为原始

But that seems like a fair bit of work... what is the reason to "remove" this hidden content? 但这似乎是一件很艰苦的工作……“删除”此隐藏内容的原因是什么? maybe there is a better solution we can offer? 也许我们可以提供更好的解决方案?

eg if this is for "security" to ensure users don't see stuff they shouldn't, then this is a bad approach... better off not to render the content in the first place. 例如,如果这是出于“安全性”,以确保用户看不到不应看到的内容,那么这是一种不好的方法……最好不要首先呈现内容。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 IE中的document.execCommand问题 - Issue with document.execCommand in IE document.execCommand(&#39;SaveAs&#39;,null,&#39;filename.csv&#39;)在chrome上不起作用 - document.execCommand('SaveAs',null,'filename.csv') is not working on chrome document.execCommand - document.execCommand 在IE中,“文件”-&gt;“另存为”和document.execCommand(&#39;SaveAs&#39;)有什么区别? - In IE, what's the difference between File->Save As and document.execCommand('SaveAs')? IE Edge:格式化问题 document.execCommand(&#39;inserttext&#39;, true, content) - IE Edge: Formatting Issue document.execCommand('inserttext', true, content) document.execCommand('SaveAs', null, 'myFile.html'); 是否有替代方案? 在 chromium 浏览器中 (Microsoft-Edge) - Is there an alternative for document.execCommand('SaveAs', null, 'myFile.html'); in chromium browsers (Microsoft-Edge) 是否有 document.execCommand 的替代品? (或者使用 document.execCommand 是否安全?) - Is there a replacement for document.execCommand? (or is it safe to use document.execCommand?) Chrome 中的 document.execCommand(&#39;heading&#39; ..&#39;) - document.execCommand('heading' ..') in Chrome document.execCommand无法正常工作 - document.execCommand not working properly document.execCommand() 字体大小(以像素为单位)? - document.execCommand() FontSize in pixels?
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM