特定のサイズのページ上の要素を見つけて、同じサイズの画像に置き換えるスクリプトを書いています。filter と replaceWith を使用して置換関数が正しく機能していますが、スクリプトをテストするときに、元の要素のスタイルをコピーして、ページの書式設定に問題がないことを確認する必要があることに気付きました。
これは、正常に動作する現在の置換スクリプトです。
function findElements(Width,Height) {
$("*").filter(function () {
return $(this).width() == Width && $(this).height() == Height;
}).replaceWith("<img src='http://mydomain.com/image.jpg' />");
}
jQuery CSS プラグインで、要素の計算されたスタイルを返し、その要素を擬似的に複製するスクリプトを見つけましたか? スタイルをコピーします。スタイル変数を宣言しようとしましたが、未定義です。何をすべきかわからない:
(function($){
$.fn.getStyleObject = function(){
var dom = this.get(0);
var style;
var returns = {};
if(window.getComputedStyle){
var camelize = function(a,b){
return b.toUpperCase();
}
style = window.getComputedStyle(dom, null);
for(var i=0;i<style.length;i++){
var prop = style[i];
var camel = prop.replace(/\-([a-z])/g, camelize);
var val = style.getPropertyValue(prop);
returns[camel] = val;
}
return returns;
}
if(dom.currentStyle){
style = dom.currentStyle;
for(var prop in style){
returns[prop] = style[prop];
}
return returns;
}
return this.css();
}
})(jQuery);
function findElements(Width,Height) {
$("*").filter(function () {
return $(this).width() == Width && $(this).height() == Height;
var style = $(this).getStyleObject();
}).replaceWith("<img src='http://mydomain.com/image.jpg' style=style='"+ style +"' />");
}