如何使用一个get方法克隆标记对象？
[英]How to clone tag object with one get method?
问题描述
How to make clones tag object with svg image data in one page. 
如何在一个页面中使用svg图像数据制作克隆标记对象。 Without many get methods to the server. 没有很多get方法到服务器。 Sample of target page 目标页面的示例
<!DOCTYPE html>
...
<object id="tg0" data="graph.svg" type="image/svg+xml" some_my_value="234"></object>
<object id="tg1" data="graph.svg" type="image/svg+xml" some_my_value="123"></object>
...
This sample get graph.svg with many get requests to graph.svg. 此示例获取graph.svg，其中包含许多对graph.svg的get请求。 First request shows result 200 all following shows result 304, but i need without the following once. 第一个请求显示结果200以下所有显示结果304，但我需要没有以下一次。
I found attr declare, but next code doesn't work wo attr data in #tg1. 我找到了attr声明，但是下一个代码在＃tg1中不能用于attr数据。
<object declare id="tg0" data="graph.svg" type="image/svg+xml"></object>
<object id="tg1" type="image/svg+xml">
<param valuetype="object" value="#tg0">
</object>
With data attr, tg1 sends following get requests. 使用数据attr，tg1发送以下get请求。
How can i do this in html, wo js. 我怎么能在html，wo js中这样做。 Is it possible to receive data from current page by relative uri ~like xpath. 是否有可能通过相对uri~喜欢xpath从当前页面接收数据。
graph.svg is self render image. graph.svg是自渲染图像。 It's can be worked in shadow root(it's not variant now) in div. 它可以在div中的阴影根（它现在不是变体）中工作。 If can be one way - to use JS, how i can put XMLHttpRequesst result into the document in tag object? 如果可以是一种方式 - 使用JS，我如何将XMLHttpRequesst结果放入标记对象的文档中？
Construction with elements like document.querySelector("..."). 使用document.querySelector（“...”）等元素构造。 contentWindow/contentDocument/document/window/innerHTML = ... doesn't whork. contentWindow / contentDocument / document / window / innerHTML = ...没有whork。
If js - need solution in pure js wo jquery and other frameworks. 如果js - 需要纯js wo jquery和其他框架的解决方案。 Firefox/Chrome. 火狐/ Chrome浏览器。
2 个解决方案
解决方案1
0 2015-05-06 06:13:08
解决方案2
0 已采纳 2015-05-07 06:08:54
I found next solution, with frames DOMs 我找到了下一个解决方案，带有框架DOM
<object id="tg0" data="graph.svg" type="image/svg+xml"></object>
<!--tg0 can be iframe-->
<iframe id="tg1" class="tg" type="image/svg+xml"></iframe>
<object id="tg2" class="tg" type="image/svg+xml"></object>
<!--iframe Firefox and Chrome; object work in Chrome only-->
<script>
//some control to onload current page and #tg0
//We can get data from tag object or iframe
var tg0_TXT=window.frames['tg0'].contentDocument.rootElement.outerHTML;
//Or get it from XMLHttpRequest
var dataReq = new XMLHttpRequest();
//...
var tg0_TXT=dataReq.responseText;
var trgIframes=document.querySelectorAll(".tg");
for(var ic0=0; ic0<trgIframes.length; ic0++) {
//Select id, because window.frames works with id
var idc=trgIframes[ic0].id;
//Firefox doesnt want write in empty contentDocument in object
//so #tg2 in Firefox is empty
if(window.frames[idc].contentDocument) {
//wo open/close scripts inside svg doesn't starts
window.frames[idc].contentDocument.open();
window.frames[idc].contentDocument.write( tg0_TXT );
window.frames[idc].contentDocument.close();
}
}
};
</script>
And we can emulate declare inside svg with frameElement.declare and window.parent.frames["..."] 我们可以使用frameElement.declare和window.parent.frames [“...”]模拟svg中的声明
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.