جاوا اسکرپٹ کا استعمال کرتے ہوئے متحرک طور پر HTML کوڈ کیسے لکھیں۔

Jawa Askrp Ka Ast Mal Krt Wy Mthrk Twr Pr Html Kw Kys Lk Y



جیسا کہ آپ جانتے ہیں، JavaScript ایک متحرک اسکرپٹنگ زبان ہے۔ ویب صفحات کو متحرک فعالیت فراہم کرنے کے لیے، جاوا اسکرپٹ میں HTML عناصر کا استعمال کرتے ہوئے HTML کوڈ لکھا جا سکتا ہے، اور آپ کے ویب صفحہ کو حسب ضرورت بنانے کے لیے جاوا اسکرپٹ میں HTML عناصر کے ساتھ مل کر CSS کی خصوصیات کا استعمال کیا جا سکتا ہے۔ جاوا اسکرپٹ ' تخلیق عنصر() ' طریقہ آپ کو HTML عناصر بنانے کی اجازت دیتا ہے، اور ' اندرونی ایچ ٹی ایم ایل پراپرٹی آپ کو ویب صفحات کے لیے مواد لکھنے کی اجازت دیتی ہے۔

یہ ٹیوٹوریل جاوا اسکرپٹ کا استعمال کرتے ہوئے متحرک طور پر HTML کوڈ لکھنے کے طریقوں کی وضاحت کرے گا۔

جاوا اسکرپٹ کا استعمال کرتے ہوئے متحرک طور پر HTML کوڈ کیسے لکھیں؟

جاوا اسکرپٹ کا استعمال کرتے ہوئے HTML کوڈ لکھنے کے لیے درج ذیل طریقے استعمال کریں:







طریقہ 1: document.createElement() طریقہ استعمال کرتے ہوئے متحرک طور پر HTML کوڈ لکھیں

جاوا اسکرپٹ ' document.createElement() 'کے ساتھ طریقہ' متن کا مواد جاوا اسکرپٹ میں متحرک طور پر HTML کوڈ لکھنے کے لیے پراپرٹی کا استعمال کیا جاتا ہے۔ createElement() طریقہ استعمال کرتے ہوئے، آپ ایک مخصوص HTML عنصر بنا سکتے ہیں، اور textContent کی خاصیت کا استعمال ٹیکسٹ مواد کو سیٹ کرنے کے لیے کیا جاتا ہے۔



نحو



جاوا اسکرپٹ میں HTML عنصر بنانے کے لیے دی گئی نحو کا استعمال کریں:





دستاویز تخلیق عنصر ( 'ٹیگ کا نام' )

مثال

یہاں، سب سے پہلے، ہم HTML

ٹیگ کا استعمال کرتے ہوئے جاوا اسکرپٹ فائل میں ایک پیراگراف بنائیں گے۔ تخلیق عنصر() طریقہ:

const متن = دستاویز تخلیق عنصر ( 'p' ) ;

متن کو پیراگراف میں سیٹ کرنے کے لیے textContent کی خاصیت کا استعمال کریں:



متن متن کا مواد = 'Linuxhint میں خوش آمدید' ;

آخر میں، 'کا استعمال کرتے ہوئے ویب صفحہ پر متن پرنٹ کریں document.write() طریقہ:

دستاویز لکھنا ( متن متن کا مواد ) ;

یہاں، آپ آؤٹ پٹ میں دیکھ سکتے ہیں کہ ہم جاوا اسکرپٹ کا استعمال کرتے ہوئے ویب پیج پر متن کو کامیابی سے لکھتے ہیں:

طریقہ 2: اندرونی ایچ ٹی ایم ایل پراپرٹی کا استعمال کرتے ہوئے HTML کوڈ کو متحرک طور پر لکھیں۔

ایچ ٹی ایم ایل کوڈ کو متحرک طور پر لکھنے کے لیے جاوا اسکرپٹ کا استعمال کریں۔ اندرونی ایچ ٹی ایم ایل ' جائیداد. HTML عنصر کے مواد کو تبدیل کرنے کا یہ سب سے آسان طریقہ ہے۔ یہ تمام براؤزرز کو سپورٹ کرتا ہے۔

نحو

اندرونی ایچ ٹی ایم ایل پراپرٹی کو استعمال کرنے کے لیے دیے گئے نحو پر عمل کریں:

اندرونی ایچ ٹی ایم ایل = 'متن'

مثال

ایچ ٹی ایم ایل فائل میں، سب سے پہلے، ایک بٹن بنائیں جو ڈیفائنڈ فنکشن کو کال کرے گا۔ سرخی () 'کلک ایونٹ پر جاوا اسکرپٹ میں:

< بٹن پر کلک کریں۔ = 'ہیڈنگ()' > یہاں کلک کریں بٹن >

ٹیگ کا استعمال کرتے ہوئے ایک پیراگراف بنائیں جہاں جاوا اسکرپٹ سے متن دکھایا جائے گا اور اسے ایک آئی ڈی تفویض کریں:

< پی آئی ڈی = 'سرخی' >> ص >

ایک فنکشن کی وضاحت کریں ' سرخی () 'جاوا اسکرپٹ فائل میں۔ HTML عنصر کا حوالہ اس کی تفویض کردہ آئی ڈی کا استعمال کرتے ہوئے حاصل کریں۔ getElementById() 'طریقہ اور لاگو کریں' اندرونی ایچ ٹی ایم ایل اس پر جائیداد:

فنکشن کی سرخی ( ) {

دستاویز getElementById ( 'سرخی' ) . اندرونی ایچ ٹی ایم ایل = '

Linuxhint میں خوش آمدید

'
;

}

آؤٹ پٹ



ہم نے جاوا اسکرپٹ کا استعمال کرتے ہوئے متحرک طور پر HTML کوڈ لکھنے سے متعلق تمام ضروری معلومات کو مرتب کیا ہے۔







نتیجہ

جاوا اسکرپٹ میں متحرک طور پر HTML کوڈ لکھنے کے لیے، ' document.createElement() 'کے ساتھ طریقہ' متن کا مواد ' جائیداد یا ' اندرونی ایچ ٹی ایم ایل ' جائیداد. پہلے طریقہ میں، آپ کو کسی HTML کوڈ کی ضرورت نہیں ہے، جبکہ اندرونی ایچ ٹی ایم ایل پراپرٹی میں، آپ کو ایچ ٹی ایم ایل عنصر تک رسائی حاصل کرنے اور اس پر آپریشن کرنے کی ضرورت ہے۔ اس ٹیوٹوریل میں، ہم نے جاوا اسکرپٹ کو متحرک طور پر استعمال کرتے ہوئے HTML کوڈ لکھنے کے طریقے بیان کیے ہیں۔