javascript sorunu

arkadaşlar aşağıdaki kod bu şekilde çalışıyor fakat döngünün içine bu şekilde bir "a" tagı eklersem (index):26 Uncaught ReferenceError: fetchBookmarks is not defined diye hata veriyor


}
function delete() {
alert("deneme");
}

function fetchBookmarks() {
var bookmarks=JSON.parse(localStorage.getItem("Bookmarks"));
var result=document.getElementById("results");


bookmarks.forEach(function (e) {
result.innerHTML+='

' +
'

'+e.name+'

' +
'Visit'+
''+

'

';

})




Bu kısım sorunsuz çalışıyor

Site Ad

Url

Kaydet

<script>


</script>





document.getElementById('frm').addEventListener('submit',saveBookmark);

function saveBookmark(event) {

var site=document.querySelector('#site').value;
var url=document.querySelector('#url').value;
var values={
name:site,
url:url
}
if(localStorage.getItem("Bookmarks")===null){
var obj=[];

obj.push(values);
localStorage.setItem("Bookmarks",JSON.stringify(obj));
}

else{
var existingBookMarks=JSON.parse(localStorage.getItem("Bookmarks"));
existingBookMarks.push(values);
localStorage.setItem("Bookmarks",JSON.stringify(existingBookMarks));
}
event.preventDefault();


}


function fetchBookmarks() {
var bookmarks=JSON.parse(localStorage.getItem("Bookmarks"));
var result=document.getElementById("results");


bookmarks.forEach(function (e) {
result.innerHTML+='

' +
'

'+e.name+'

' +
'Visit'+

'

';

})



}

HTML tagları üzerinden onload, onclick gibi JS eventlerini çağırmak doğru bir yaklaşım değil. Neden? Eskiden kullanılan genel ve düz mantık bugün geriye dönük uyumluluk adı altında hala kullanılabilir ama güncel ihyiaçları karşılamak için yeterli değil. Burada anahtar kelimen Event Listener/Handler.

Hatana bakacak olursak "...is not defined..." diye bir ibare varsa tanımlanmamış içerik ya gerçekten tanımlı değil ya da daha yüklenmemiştir. Sayfa yüklenirken body'den onload tetikleniyor ama sayfanın altındaki JS kodları daha yüklenmediği için hata veriyor olabilir. Burada Global Event Handlers konusuna bakman gerekiyor. Linkteki window.onload eventinde ilk tetiklemeyi yapabilirsin.

Bu yetmez, ilk önce JSON.parse dediğin şeyi, localStorage'dan gelen veriye bir bak. İf ile null mu, empty mi, geçersiz bir JSON içeriği mi vs, belkide bir eklenti veya kullanıcı kurcalamıştır. Sonra bir döngün var, orada da e.href demişsin, null mu değil mi, hatta özel bir şey bekliyorsan (burada link bekliyorsun) onu Regex ile bir kontrol et.

Kodlarından anlaşılıyor ki OOP bilgin çok zayıf, OOP ve DOM konularına birkaç haftanı ayır yoksa Frameworkler'de daha fazla vakit kaybedersin.

teşekkürler