Çözüldü HTML sayfasına JS nasıl dahil edilir?

Bu konu çözüldü olarak işaretlenmiştir. Çözülmediğini düşünüyorsanız konuyu rapor edebilirsiniz.
Çözüm
K
264523 dedi:
hiç bir şekilde javascript çalışmıyor.
HTML: 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="icon" href="activate.jpg" type="image/x-icon" />
    <title>Loading...</title>
            <style>
                body {
                background-image: url("680342.jpg");
                background: #111;
                color: #411;
                font-family: Consolas, Courier, monospace;
                font-size: 60px;
                text-shadow: 0 0 15px #411;
                height: 100%;
                }

                div {
                padding:100px;
                position: relative;
                top: 50%;
                margin: -30px auto;
                text-align: center;
                }

                .glow {
                color: #f00;
                text-shadow: 0px 0px 10px #f00;
                }

                span {
                display: inline-block;
                padding: 0 10px;
                }
            </style>
  
  
</head>
<body>
  
    <div id="loading"> LOADING...</div>
    <script>
        alphabet = new Array("A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U", "V", "W", "X", "Y", "Z", "1", "2", "3", "4", "5", "6", "7", "8", "9", "0");
letter_count = 0;
el = $("#loading");
word = el.html().trim();
finished = false;

el.html("");
for (var i = 0; i < word.length; i++) {
  el.append("<span>"+word.charAt(i)+"</span>");
}

setTimeout(write, 75);
incrementer = setTimeout(inc, 1000);

function write() {
  for (var i = letter_count; i < word.length; i++) {
    var c = Math.floor(Math.random() * 36);
    $("span")[i].innerHTML = alphabet[c];
  }
  if (!finished) {
    setTimeout(write, 75);
  }
}

function inc() {
  $("span")[letter_count].innerHTML = word[letter_count];
  $("span:eq("+letter_count+")").addClass("glow");
  letter_count++;
  if (letter_count >= word.length) {
    finished = true;
    setTimeout(reset, 1500);
  } else {
    setTimeout(inc, 1000);
  }
}

function reset() {
  letter_count = 0;
  finished = false;
  setTimeout(inc, 1000);
  setTimeout(write, 75);
  $("span").removeClass("glow");
}
    </script>
  
</body>
</html>
Genişletmek için tıkla...
JavaScript: 
$()
Bu fonksiyonu kullanmışsınız ama jQuery kurulu değil.

HTML: 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
Bu tagi head bölümüne yazarak jQuery'yi eklerseniz sorun çözülür.
Tarihe göre sırala Puana göre sırala
264523 dedi:
HTML sayfasına nasıl JS dahil edilir?
Genişletmek için tıkla...

İsterseniz sayfanızın head veya body kısımlarına ve sonuna

JavaScript: 
<script src="javascript.js"></script>

Koyarak işlemlerinizi yapabilirsiniz.
Benzer bir şekilde hiçbir dosya yolu göstermeden de .html dosyasınızda JS kullanabilirsiniz.

<script>
var a = 1;
</script>

Şeklinde.

kaan.w dedi:
Head bölümüne yazabilirsiniz.
HTML: 
<script src="app.js" defer></script>
Genişletmek için tıkla...

Burada kullanmış olduğunuz defer'in işlevi nedir acaba?
 
Artı 0 Eksi
00PARZIVAL00 dedi:
Burada kullanmış olduğunuz defer'in işlevi nedir acaba?
Genişletmek için tıkla...
defer kullanmaz iseniz scripti head bölümüne yazdığınızda sorun çıkarır. Daha sayfa içeriği yüklenmeden script çalıştırıldığı için. Bu yüzden hep body'nin en sonuna yazılması önerilir.

defer kullanıldığında script ile sayfa paralel yüklenir ve sayfa yüklendiğinde script çalışır. Bu sayede head bölümüne yazıp okunulabilirliği arttırabilirz. İstediğiniz yere yazamassınız.
www.w3schools.com

W3Schools.com

W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more.
www.w3schools.com www.w3schools.com
HTML: 
<script src="app.js" defer></script>
 
Son düzenleme:
Artı 0 Eksi
hiç bir şekilde javascript çalışmıyor.
HTML: 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="icon" href="activate.jpg" type="image/x-icon" />
    <title>Loading...</title>
            <style>
                body {
                background-image: url("680342.jpg");
                background: #111;
                color: #411;
                font-family: Consolas, Courier, monospace;
                font-size: 60px;
                text-shadow: 0 0 15px #411;
                height: 100%;
                }

                div {
                padding:100px;
                position: relative;
                top: 50%;
                margin: -30px auto;
                text-align: center;
                }

                .glow {
                color: #f00;
                text-shadow: 0px 0px 10px #f00;
                }

                span {
                display: inline-block;
                padding: 0 10px;
                }
            </style>
    
    
</head>
<body>
    
    <div id="loading"> LOADING...</div>
    <script>
        alphabet = new Array("A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U", "V", "W", "X", "Y", "Z", "1", "2", "3", "4", "5", "6", "7", "8", "9", "0");
letter_count = 0;
el = $("#loading");
word = el.html().trim();
finished = false;

el.html("");
for (var i = 0; i < word.length; i++) {
  el.append("<span>"+word.charAt(i)+"</span>");
}

setTimeout(write, 75);
incrementer = setTimeout(inc, 1000);

function write() {
  for (var i = letter_count; i < word.length; i++) {
    var c = Math.floor(Math.random() * 36);
    $("span")[i].innerHTML = alphabet[c];
  }
  if (!finished) {
    setTimeout(write, 75);
  }
}

function inc() {
  $("span")[letter_count].innerHTML = word[letter_count];
  $("span:eq("+letter_count+")").addClass("glow");
  letter_count++;
  if (letter_count >= word.length) {
    finished = true;
    setTimeout(reset, 1500);
  } else {
    setTimeout(inc, 1000);
  }
}

function reset() {
  letter_count = 0;
  finished = false;
  setTimeout(inc, 1000);
  setTimeout(write, 75);
  $("span").removeClass("glow");
}
    </script>
    
</body>
</html>
 
Artı 0 Eksi
264523 dedi:
hiç bir şekilde javascript çalışmıyor.
HTML: 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="icon" href="activate.jpg" type="image/x-icon" />
    <title>Loading...</title>
            <style>
                body {
                background-image: url("680342.jpg");
                background: #111;
                color: #411;
                font-family: Consolas, Courier, monospace;
                font-size: 60px;
                text-shadow: 0 0 15px #411;
                height: 100%;
                }

                div {
                padding:100px;
                position: relative;
                top: 50%;
                margin: -30px auto;
                text-align: center;
                }

                .glow {
                color: #f00;
                text-shadow: 0px 0px 10px #f00;
                }

                span {
                display: inline-block;
                padding: 0 10px;
                }
            </style>
  
  
</head>
<body>
  
    <div id="loading"> LOADING...</div>
    <script>
        alphabet = new Array("A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U", "V", "W", "X", "Y", "Z", "1", "2", "3", "4", "5", "6", "7", "8", "9", "0");
letter_count = 0;
el = $("#loading");
word = el.html().trim();
finished = false;

el.html("");
for (var i = 0; i < word.length; i++) {
  el.append("<span>"+word.charAt(i)+"</span>");
}

setTimeout(write, 75);
incrementer = setTimeout(inc, 1000);

function write() {
  for (var i = letter_count; i < word.length; i++) {
    var c = Math.floor(Math.random() * 36);
    $("span")[i].innerHTML = alphabet[c];
  }
  if (!finished) {
    setTimeout(write, 75);
  }
}

function inc() {
  $("span")[letter_count].innerHTML = word[letter_count];
  $("span:eq("+letter_count+")").addClass("glow");
  letter_count++;
  if (letter_count >= word.length) {
    finished = true;
    setTimeout(reset, 1500);
  } else {
    setTimeout(inc, 1000);
  }
}

function reset() {
  letter_count = 0;
  finished = false;
  setTimeout(inc, 1000);
  setTimeout(write, 75);
  $("span").removeClass("glow");
}
    </script>
  
</body>
</html>
Genişletmek için tıkla...
JavaScript: 
$()
Bu fonksiyonu kullanmışsınız ama jQuery kurulu değil.

HTML: 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
Bu tagi head bölümüne yazarak jQuery'yi eklerseniz sorun çözülür.
 
Artı 1 Eksi
Çözüm
kaan.w dedi:
JavaScript: 
$()
Bu fonksiyonu kullanmışsınız ama jQuery kurulu değil.

HTML: 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
Bu tagi head bölümüne yazarak JQuery'yi eklerseniz sorun çözülür.
Genişletmek için tıkla...

Çok teşekkür ederim. Sabahtan beri araştırıyorum bir hata da yok ama çalıştıramadım. Sayende çalışıyor.
 
Artı 0 Eksi

Benzer konular

P
HTML-JS-CSS kodları nasıl şifrelenir?
Mesaj
4
Görüntüleme
329
RaSGooL
RaSGooL
Eşref Bey
  • Çözüldü
Çözüldü  HTML, JS ile nasıl bağlanır?
Mesaj
4
Görüntüleme
2.965
Alquard
Alquard
mrcbrbn
  • Soru
HTML, CSS ve JS kodları nasıl ayrılır?
Mesaj
2
Görüntüleme
2.295
Shrp
Shrp
TabutcuZenciMan
PHP vs HTML, CSS, JS
Mesaj
5
Görüntüleme
372
TosunPASA
TosunPASA
SadeceBirİnsanAHuman
  • Soru
JS ile web sayfasına sürüklenen dosyayı çekme
Mesaj
1
Görüntüleme
474
MCV
MCV

Technopat Haberler

Yeni konular

Yeni mesajlar

Geri
Yukarı