كيفية تغيير URL في شريط العنوان دون إعادة تحميل الصفحة؟

مرحباً بالجميع! أنا مطور frontend مبتدئ وواجهت هذه المهمة: أحتاج إلى تغيير URL في شريط عنوان المتصفح عندما ينقر المستخدم على الروابط داخل الموقع، ولكن دون إعادة تحميل الصفحة. على سبيل المثال، لدي تطبيق من صفحة واحدة (SPA) مع قائمة مقالات. عندما ينقر المستخدم على عنوان مقال، أريد أن يتغير URL من `/` إلى `/article/123`، ولكن يتم تحميل المحتوى عبر AJAX دون إعادة تحميل كاملة. حالياً أستخدم روابط عادية مع `href`، والمتصفح يعيد تحميل الصفحة ببساطة. جربت استخدام `window.location.href = '/article/123'`، ولكن هذا أيضاً يسبب إعادة تحميل. إليك مثال على الكود الحالي الخاص بي: ```javascript // هذا لا يعمل كما ينبغي document.querySelector('.article-link').addEventListener('click', function(e) { e.preventDefault(); window.location.href = '/article/123'; // لا يزال يعيد تحميل الصفحة // تحميل المحتوى عبر fetch... }); ``` كيف يمكنني تغيير URL بشكل صحيح دون إعادة تحميل؟