JS работает на клиентской стороне, он работает в реал-тайм. - он не будет без тебя ничего перегружать.
Если не нужно перегружать страницу - значит нужно данные подгружать "извне"
а в этом всегда спасает AJAX
значит достаточно, допустим создать пустой эл-т <div id="compare"></div>
в него уже подгружать данные.
при этом каждый раз добавляя что-либо для сравнения - нужно не переписывать данные в этом div - а добавлять.
самое простое - это в этот блок добавлять товары для сравнения (простым JS без AJAX) + добавить ссылку для перехода в отдельный раздел сравнения
а вот в этом уже разделе - получить все ID товаров и вывести их характеристики
<html>
<head>
<script type="text/javascript">
Compare = new Array();
function add_compare(id){
var divCompare = document.getElementById('compare');
var product = document.getElementById('p'+id).innerHTML;
newcompare = '<div id="b'+id+'">' + product + ' <a href="#" onclick="remove_compare("b'+id+'")">del</a></div>';
divCompare.innerHTML = divCompare.innerHTML + newcompare;
Compare.push(id);
return false;
}
function remove_compare(id){
}
</script>
</head>
<body>
<!--Список товаров-->
<?php for($i=1; $i<10; $i++):?>
<span id="p<?=$i;?>">Товар c ID=<?=$i;?></span> <a href="#" onclick="add_compare(<?=$i;?>)">добавить к сравнению</a><br/>
<?php endfor;?>
<div id="compare">
<h3>Сравнение:</h3>
</div>
</body>
</html>
_____________
HTML, CSS (Bootstrap), JS(JQuery, ExtJS), PHP, MySQL, MSSql, Posgres, (TSql, BI OLAP, MDX), Mongo, Git, SVN, CodeIgnater, Symfony, Yii 2, JiRA, Redmine, Bitbucket, Composer, Rabbit MQ, Amazon (SQS, S3, Transcribe), Docker