Mavzu: css хусусиятлари. Cssсахифалаш. Css3 хусусиятлар

Download 254,89 Kb.
Sana	16.05.2024
Hajmi	254,89 Kb.
	#238046

Bog'liq
web dasturlash m4

O’ZBEKISTON RESPUBLIKASI RAQAMLI TEXNOLOGIYALARNI RIVOJLANTIRISH VAZIRLIGI

MUHAMMAD AL-XORAZMIY NOMIDAGI TOSHKENT AXBOROT TEXNOLOGIYALAR UNIVERSITETI

Veb dasturlashga kirish fanidan

Taqdimoti

WEB006 : Axtamov Ahmadxuja

O’qituvchi : Alimova Fotima

9-mavzu. JavaScript brauzer va veb-hujjat ob'ektlari modeli bilan ishlash. Hujjatning ob'ektli modeli haqida tushuncha (DOM). Hujjatning ob'ektli modelida HTML ob'ektlari va CSS xususiyatlari bilan ishlash. JavaScript brauzer ob'ekti modeli. (BOM). Date ob'ekti usullari va xususiyalari.

Reja: 1. DOM tushunchasi 2. DOM Window obyekti 3. DOM stillar bilan ishlash 4. DOM Document obyekti 5. JavaScript brauzer ob'ekti modeli(BOM).

HTML DOM bilan JavaScript HTML hujjatining barcha elementlariga kirish va o'zgartirish imkoniyatiga ega

Boshqacha qilib aytganda: HTML DOM HTML elementlarini qanday olish, o'zgartirish, qo'shish yoki yo'q qilish uchun standartdir.

DOM tushunchasi

My First Page

DOM Window (print)

Click the button to print the current page.

DOM Window (open)

Click the button to open a new browser window.

DOM Window (prompt)

Click the button to demonstrate the prompt box.

DOM Window (confirm)

Click the button to display a confirm box.

DOM Window (close)

DOM Window (focus)

Click the button to open a new window, and assure that the new window GETS focus (send the new window to the front).

DOM style (backgroundColor)

Hello World!

DOM Style (bakcgroundimage)

Hello World!

DOM Document (close)

Click the button to open an output stream, add some text, and close the output stream.

JavaScript brauzer ob'ekti modeli(BOM).

Brauzer ob'ekt modeli (BOM) brauzer bilan ishlash uchun ishlatiladi.

Brauzerning standart ob'ekti oyna bo'lib, siz oynani belgilash orqali yoki to'g'ridan-to'g'ri oynaning barcha funktsiyalariga qo'ng'iroq qilishingiz mumkin.

Masalan:

window.alert("hello javatpoint");

is same as:

alert("hello javatpoint");

Hujjat, tarix, ekran, navigator, joylashuv, innerHeight, innerWidth kabi oyna ob'ekti ostida aniqlangan ko'plab xususiyatlardan (boshqa ob'ektlar) foydalanishingiz mumkin.

Yana shuni yodda tutish lozimki hujjat obyekti html hujjatini ifodalaydi. U DOM (Hujjat obyekti modeli) ni tashkil qiladi.

Download 254,89 Kb.

Mavzu: css хусусиятлари. Cssсахифалаш. Css3 хусусиятлар

O’ZBEKISTON RESPUBLIKASI RAQAMLI TEXNOLOGIYALARNI RIVOJLANTIRISH VAZIRLIGI

O’ZBEKISTON RESPUBLIKASI RAQAMLI TEXNOLOGIYALARNI RIVOJLANTIRISH VAZIRLIGI

MUHAMMAD AL-XORAZMIY NOMIDAGI TOSHKENT AXBOROT TEXNOLOGIYALAR UNIVERSITETI

Veb dasturlashga kirish fanidan

Taqdimoti

WEB006 : Axtamov Ahmadxuja

O’qituvchi : Alimova Fotima

9-mavzu. JavaScript brauzer va veb-hujjat ob'ektlari modeli bilan ishlash. Hujjatning ob'ektli modeli haqida tushuncha (DOM). Hujjatning ob'ektli modelida HTML ob'ektlari va CSS xususiyatlari bilan ishlash. JavaScript brauzer ob'ekti modeli. (BOM). Date ob'ekti usullari va xususiyalari.

Reja: 1. DOM tushunchasi 2. DOM Window obyekti 3. DOM stillar bilan ishlash 4. DOM Document obyekti 5. JavaScript brauzer ob'ekti modeli(BOM).

HTML DOM bilan JavaScript HTML hujjatining barcha elementlariga kirish va o'zgartirish imkoniyatiga ega

HTML DOM bilan JavaScript HTML hujjatining barcha elementlariga kirish va o'zgartirish imkoniyatiga ega

Boshqacha qilib aytganda: HTML DOM HTML elementlarini qanday olish, o'zgartirish, qo'shish yoki yo'q qilish uchun standartdir.

My First Page

My First Page

</h2> <h2>document.getElementById("demo").innerHTML = "Hello World!";</h2> <h2>

DOM Window (print)

Click the button to print the current page.

Print this page

</h2> <h2>function myFunction() {</h2> <h2> window.print();</h2> <h2>}</h2> <h2>

DOM Window (open)

Click the button to open a new browser window.

Try it

</h2> <h2>function myFunction() {</h2> <h2>window.open("https://www.kun.uz"); }</h2> <h2>

DOM Window (prompt)

Click the button to demonstrate the prompt box.

Try it

</h2> <h2>function myFunction() {</h2> <h2> var person = prompt("Please enter your name", "Harry Potter");</h2> <h2> if (person != null) {</h2> <h2> document.getElementById("demo").innerHTML =</h2> <h2> "Hello " + person + "! How are you today?"; }</h2> <h2>}</h2> <h2>

DOM Window (confirm)

Click the button to display a confirm box.

Try it

</h2> <h2>function myFunction() {</h2> <h2> confirm("Press a button!"); }</h2> <h2>

DOM Window (close)

Open "myWindow"

Close "myWindow"

</h2> <h2>var myWindow;</h2> <h2>function openWin() {</h2> <h2> myWindow = window.open("", "myWindow", "width=200,height=100");</h2> <h2> myWindow.document.write(" <br />This is 'myWindow' <br />");</h2> <h2>}</h2> <h2>function closeWin() {</h2> <h2> myWindow.close();</h2> <h2>}</h2> <h2>

DOM Window (focus)

Click the button to open a new window, and assure that the new window GETS focus (send the new window to the front).

Try it

</h2> <h2>function myFunction() {</h2> <h2> var myWindow = window.open("", "", "width=200,height=100");</h2> <h2> myWindow.document.write(" <br />A new window! <br />");</h2> <h2> myWindow.focus();</h2> <h2>}</h2> <h2>

DOM style (backgroundColor)

Hello World!

Set background color

</h2> <h2>function myFunction() {</h2> <h2> document.body.style.backgroundColor = "red";</h2> <h2>}</h2> <h2>

DOM Style (bakcgroundimage)

Hello World!

Set background image

</h2> <h2>function myFunction() {</h2> <h2> document.body.style.backgroundColor = "#f3f3f3";</h2> <h2> document.body.style.backgroundImage = "url('img_tree.png')";</h2> <h2>}</h2> <h2>

DOM Document (close)

Click the button to open an output stream, add some text, and close the output stream.

Try it

</h2> <h2>function myFunction() {</h2> <h2> document.open();</h2> <h2> document.write("<h2>Hello World</h2>");</h2> <h2> document.close();</h2> <h2>}</h2> <h2>

JavaScript brauzer ob'ekti modeli(BOM).

Brauzer ob'ekt modeli (BOM) brauzer bilan ishlash uchun ishlatiladi.

Brauzerning standart ob'ekti oyna bo'lib, siz oynani belgilash orqali yoki to'g'ridan-to'g'ri oynaning barcha funktsiyalariga qo'ng'iroq qilishingiz mumkin.

Masalan:

window.alert("hello javatpoint");

is same as:

alert("hello javatpoint");

Hujjat, tarix, ekran, navigator, joylashuv, innerHeight, innerWidth kabi oyna ob'ekti ostida aniqlangan ko'plab xususiyatlardan (boshqa ob'ektlar) foydalanishingiz mumkin.

Yana shuni yodda tutish lozimki hujjat obyekti html hujjatini ifodalaydi. U DOM (Hujjat obyekti modeli) ni tashkil qiladi.

Mavzu: css хусусиятлари. Cssсахифалаш. Css3 хусусиятлар