5.1 document.getElementById()
Билесиӊ да, JavaScript түзүлгөндө кандайдыр бир жандуу кылуу үчүн HTML-баракчаларга бир аз анимация кошуу үчүн болгон. Азырынча биз бул жөнүндө дээрлик эч нерсе айткан жокпуз. Ошондо кантип ушул анимацияны кошуу керек? Мисалы, кандайдыр бир элементтин түсүн кантип өзгөртүү керек?
Элементтин түсүн өзгөртүү үчүн, алгач бул элементти табышыӊ керек. Бул үчүн document.getElementById(); функциясы бар. HTML'иңде керектүү элементке id жазып кой, анан JavaScript'тен ага кайрылсаӊ болот. Мисал:
<head>
<script>
function changeImage()
{
var image = document.getElementById("image123");
image.src = "new-image.png";
}
</script>
</head>
<body>
<img id="image123" scr="big-image.png" onclick="changeImage()">
</body>
Колдонуучу сүрөттү чычкан менен басканда, changeImage() функциясы чакырылат. Анын ичинде биз ID аркылуу image элементин алабыз, анан анын src атрибутун жаӊы мааниге өзгөртөбүз. Бул менен img элемент жыӊы сүрөттү жүктөйт.
5.2 document.createElement()
Элементти алуудан тышкары, биз жаӊы элементтерди түзүп, барларын өчүрө алабыз.
Элементтерди түзүү абдан оңой. Бул үчүн эки кадам аткаруу керек: а) элементти түзүү, б) аны документтин керектүү жерине кошуу. Бул көп учурда мындай көрүнөт:
<head>
<script>
window.onload = function () {
var image = document.createElement("IMG");
var image.src = "big-image.png";
document.body.addAfter(image);
}
</script>
</head>
<body>
</body>
5.3 window.navigate() методу
Дагы бир абдан пайдалуу метод бар – бул window.navigate() методу. Анын жардамы менен сен браузерди учурдагы баракчанын ордуна жаӊы баракчаны жүктөөгө мажбурлай аласыӊ. Жөн гана анын URL'ин бул методго өткөрүп бер да, аны чакыр. Мисал:
<body>
<img scr="big-image.png" onclick="window.navigate('https://google.com');">
</body>
Жогорудагы мисалда, колдонуучу сүрөттү баскандан кийин, учурдагы вкладкага google.com баракчасы жүктөлөт.
5.4 Учурдагы URL
Жана дагы бир пайдалуу нерсе. Кээде скриптке учурдагы баракчанын URL'ин билип алуу абдан маанилүү болот. Мисалы, бирдей скрипт ар башка баракчаларга кошулушу мүмкүн. Бул кантип жасалат?
Бул үчүн атайын document.location.href касиети бар
var currentURL = document.location.href;
GO TO FULL VERSION