SVG (또는 기타)를 객체로 동적으로로드합니다. Chrome 보안 기능?

-1

사이트 자체 - test.vancebeckett.com (알파입니다. 텍스트와 다른 것들은 이제는 빨기 때문에 다시 시도 할 것입니다.)SVG (또는 기타)를 객체로 동적으로로드합니다. Chrome 보안 기능?

var p2ComicTileAttributes = ["class", "comicTiles p2Content", "id", "p2ComicTile", "type", "image/svg+xml", "data", "svg/p2Comic.svg", "onload", "p2Status++;p2Tiles.splice(0,1,this);"]; 
function loadPageSVGContent(attributesArray) { 
    var pageObj = document.createElement("object"); 
    for (var i = 0; i < attributesArray.length; i += 2) { 
     pageObj.setAttribute(attributesArray[i], attributesArray[i + 1]); 
    } 
    document.getElementById("contentLayout").appendChild(pageObj) 
}; 
loadPageSVGContent(p2ComicTileAttributes); 
/*This creates an objects, appends them in DOM, sets thair attributes and even runs thair inline code (onload) in Edge and FF, but do neither in Chrome-based browsers. Is this another Chrome safety feature? Like it can't load SVG's (or any other xml) from another domain and have an access to its DOM, it also doesn't allow do the same from local folder, only from the server. "contentLayout" - div-wrapper in HTML document. 
So, maybe there's a way to use ajax and somehow pass loaded document to "data" attribute? 
About performance, if I will inject SVG's in the html - these SVG's are 100-200KB each, and I have many. I'm sure it will slow down any DOM manipulations. And also I want to find the best way anyway :).*/

무엇 작동합니다 : 당신은 그것을 "어떤을 클릭하여 에지 및 FF (아마 다른 곳도)에서 작동하는 방법을 확인할 수 있습니다 JS 파일에서 : (예)를 작동하지 않습니다 무엇 :

편집 "목차"에 "내 작업"및 "소개"를 포함합니다.

그리고 JS를 찾을 수 없습니다 사람들을 위해 자신을 제출하고 평가에 마이너스 주었다 http://test.vancebeckett.com/main.js이

(또는 FF에서 : 요소 검사 - 디버거 - main.js)

출처

2017-12-14 ValeriyB

최소한의 예가 유용 할 것입니다. – david25272

보기 main.js – zero298

성능이 다른 이유는 무엇입니까? 그 가정을 어떤 식 으로든 테스트 해 봤니? –

확인을, 내가 가진를 드디어 혼자서 해결했습니다! XMLHttpRequest를 사용하여 .svg 파일을로드합니다. 상태가 표시되면로드 된 상태에서 "data"속성이 "path/to/your/image.svg"로 설정된 "객체"노드를 만들고이 파일을 다음 위치의 래퍼에 추가합니다. DOM - 비올라! 애니메이션이 될 수있는 svg 요소가 있고 HTML에서 인라인되지 않습니다!

출처

2017-12-16 13:08:53 ValeriyB

SVG (또는 기타)를 객체로 동적으로로드합니다. Chrome 보안 기능?

답변

관련 문제