JQuery "display:none" добавляется при клонировании outerhtml
У меня есть сайт Magento, где мне нужно взять содержимое таблицы и использовать его снова в другом месте на той же странице продукта. У меня проблема в том, что все отлично работает на локальном хосте, но при развертывании на наших серверах dev & live. Код выглядит следующим образом:
$j( window).on('load', function() {
moveSpecTable();
});
function moveSpecTable(){
console.log('doc ready?');
if($j('table:first').prop('outerHTML').length){
console.log("length ");
try {
var t = $j('table').html($j('table:first').clone()).html();
//$j('table:first').prop('outerHTML');
//$j(t).css("display" , "table");
$j($j('.add-to-cart-wrapper')).append(t);
}catch (err){
console.log('ERROR');
}
}
console.log(t);
return false;
}
Вывод на моем локальном сервере MAMP выглядит следующим образом:
<table border="0">
Вывод на live/dev серверах выглядит следующим образом:
<table style="display: none;" border="0">
Кто-нибудь знает, почему это происходит? Тот же результат, использую ли я clone или outerhtml.
Спасибо
1 ответ
Я не мог понять, почему это происходит, поэтому изменил мой подход.
/ ** * Перерисовать таблицу спецификаций */
$j( window).on('load', function() {
moveSpecTable();
});
function moveSpecTable(){
if($j('table:first').prop('outerHTML').length){
try {
var t = '<table style="display:table; border: 0;">';
var t1 = $j('table:first').prop('innerHTML');
var t2 ='</table>';
var res = t.concat(t1, t2);
$j($j('.add-to-cart-wrapper')).append(res);
}catch (err){
console.log('ERROR');
}
}
return false;
}
Из тестирования я знал, что захват innerHtml не привел к добавлению "display:none" в таблицу. Поэтому я просто объединяю начало и конец таблицы с innerHtml & boom. Это работает так, как я хочу. Не слишком умный, но....