আপনার জাভাস্ক্রিপ্টের অভ্যন্তরীণ HTML সম্পর্কে জানতে হবে



জাভাস্ক্রিপ্টের অভ্যন্তরীণ এইচটিএমএল খুব কার্যকরী বৈশিষ্ট্য এবং ওয়েব পৃষ্ঠাগুলি তৈরি হওয়ার জন্য আরও গতিশীল এবং বহুমুখী দিকটি সরবরাহ করতে ব্যাপকভাবে ব্যবহৃত হয়।

জাভাস্ক্রিপ্ট সর্বাধিক ব্যবহৃত প্রোগ্রামিং ভাষাগুলির একটি। প্ল্যাটফর্মগুলি জুড়ে এটির বহুমুখীতার জন্য এটি বেশ জনপ্রিয়। বিভিন্ন বৈশিষ্ট্য আছে যা আপনার গতিশীল ওয়েবসাইট তৈরির কাজটিকে সহজ করে তোলে। এই নিবন্ধে, আমরা নিম্নলিখিত অনুক্রমের মধ্যে জাভাস্ক্রিপ্ট ইনার এইচটিএমএল আলোচনা করব:

জাভাস্ক্রিপ্টের ভূমিকা

জাভাস্ক্রিপ্ট ক্লায়েন্ট-সাইড প্রোগ্রামিং ভাষার পাশাপাশি সার্ভার-সাইড প্রোগ্রামিং ভাষা হিসাবে ব্যবহৃত হয়। এক্সিকিউট করতে ব্যবহৃত হয় ক্লায়েন্ট-পাশাপাশি পাশাপাশি কোনও অ্যাপ্লিকেশনটির সার্ভার-সাইড। নোডকে বিভিন্ন স্থানে নোড.জেএসও বলা যেতে পারে।





জাভাস্ক্রিপ্ট - জাভাস্ক্রিপ্ট অভ্যন্তরীণ এইচটিএমএল - এডুরেকা

জাভাস্ক্রিপ্ট সহজেই সঞ্চালিত হতে পারে বিভিন্ন কার্যকারিতা জন্য পদ্ধতির আধিক্য উপলব্ধ। এটি যা জাভাস্ক্রিপ্টকে একটি জনপ্রিয় প্রোগ্রামিং ভাষা হিসাবে তৈরি করেছে পাশাপাশি এটি বিভিন্ন ধরণের পণ্য বিকাশে ব্যাপকভাবে ব্যবহৃত হচ্ছে।



জাভাস্ক্রিপ্ট ইনার এইচটিএমএল

ভিতরের জাভাস্ক্রিপ্টে সম্পত্তি হ'ল অত্যন্ত কার্যকর বৈশিষ্ট্যগুলির মধ্যে একটি এবং ওয়েব পৃষ্ঠাগুলি তৈরি হওয়ার জন্য আরও গতিশীল এবং বহুমুখী দিক সরবরাহ করতে ব্যাপকভাবে ব্যবহৃত হয়।

যদি আমরা কেবল অন্তর্নিহিত এইচটিএমএলকে ব্যাখ্যা করার চেষ্টা করি তবে কেবলমাত্র অভ্যন্তরীণ এইচটিএমএল দ্বারা সম্পাদিত কাজটি হ'ল পুরো পৃষ্ঠাটি রিফ্রেশ না করে পৃষ্ঠার সামগ্রী লোড করা। এটি ডেটা ব্যবহারের পাশাপাশি পৃষ্ঠার লোডের পিছনে সময় সাশ্রয় করে এবং এটি অর্জন করা বেশ সহজ। এটি ব্যবহারকারীকে খুব দ্রুত এবং প্রতিক্রিয়াশীল অনুভূতি দেয় যাতে ব্যবহারকারীর অভিজ্ঞতা আরও উন্নত হয়।

এটি কিছুটা কঠিন মনে হতে পারে তবে উদাহরণের সাহায্যে এটি বোঝার চেষ্টা করি।



উদাহরণ:

 

অভ্যন্তরীণ এইচটিএমএল পাঠ্য পরিবর্তন করতে এখানে ক্লিক করুন।

ফাংশন myFunction () {document.getElementById ('অনুচ্ছেদ 1') inner অভ্যন্তরীণ এইচটিএমএল = 'অনুচ্ছেদে পরিবর্তন হয়েছে!' }

এখানে উপরের কোডটিতে অনুচ্ছেদে ট্যাগের আইডিটি অনুচ্ছেদ 1।

সেখানে একটি ফাংশন নাম দেওয়া মাইফ্যাঙ্কশন () যা 'অভ্যন্তরীণ এইচটিএমএল পাঠ্য পরিবর্তন করতে এখানে ক্লিক করুন' পাঠ্যের উপর ক্লিক করে বাতিল করা হবে।ক্লিকের পরে ফাংশনটি প্রত্যাহার করা হলে, ফাংশনটি কার্যকর হয়ে যায় যা বলে getElementById ('অনুচ্ছেদ 1'), যা ডেমো হিসাবে আইডির সাথে উপাদানটি নির্বাচন করতে হবে বলে উল্লেখ করে।

আরও, আমাদের অভ্যন্তরীণ এইচটিএমএল ফাংশন রয়েছে যার অর্থ কী করা হবে তা অন্লিক করার পরে simply এখানে উপরের উদাহরণে এটি কেবল 'অনুচ্ছেদে পরিবর্তিত'।

নীচে উপরের কোডটির প্রাথমিক আউটপুট দেওয়া আছে।

নীচে ক্লিকের পরে পরিবর্তিত আউটপুট রয়েছে।

অর্ডার করা বা অর্ডারযুক্ত তালিকা সহ অন্তর্নিহিত এইচটিএমএল

অর্ডারযুক্ত বা আনর্ডারড তালিকার সাথে ইনারএইচটিএমএল ব্যবহার দেখানোর জন্য নীচে একটি উদাহরণ দেওয়া আছে।

উদাহরণ:

 
  • হ্যালো
  • আবারো স্বাগতম

উল উপাদানটির বিষয়বস্তু পেতে নীচের বোতামটি ক্লিক করুন।

এটি চেষ্টা করুন হ্যালো ফাংশন () x var এক্স = ডকুমেন্ট.জেট এলিমেন্টবাইআইডি ('মাইলিস্ট') inner অভ্যন্তরীণ এইচটিএমএল ডকুমেন্ট.সেটমেন্টবিইআইডি ('অনুচ্ছেদ 1')।

এখানে অভ্যন্তরীণ এইচটিএমএল 'চেষ্টা করে দেখুন' নামটি দ্বারা সংজ্ঞায়িত বোতামটি দ্বারা ট্রিগার হয়ে যায়।

উপরের পাঠ্যের প্রাথমিক আউটপুটটি হ'ল:

বোতামে ক্লিক করার পরে আউটপুট। বোতামটির ক্লিকটি পৃষ্ঠার পুনরায় লোডের দিকে পরিচালিত করে না পরিবর্তে এটি অভ্যন্তরীণ এইচটিএমএল ব্যবহারের কারণে হয়েছিল।

ইউআরএল পরিবর্তন করার জন্য ইনার এইচটিএমএল

নীচে অন্য একটি উদাহরণ যা বোতাম টিপে URL পরিবর্তন করার জন্য অন্তর্নিহিত এইচটিএমএল ব্যবহার দেখায়।

উদাহরণ:

  উইকিপিডিয়া লিঙ্ক ফাংশন myFunction () {document.getElementById ('myAncor') পরিবর্তন করুন inner ) .তারাগেট = '_ব্ল্যাঙ্ক'}

উপরের উদাহরণটি প্রাথমিকভাবে উইকিপিডিয়া ওয়েবসাইটে লিঙ্কটি দেয় তবে বোতামটি ক্লিক করা হলে গুগলে লিঙ্কটি পরিবর্তন হয়।

এই জাতীয় বেশ কয়েকটি অপারেশন রয়েছে যেখানে পৃষ্ঠাটি পুনরায় লোড করার দরকার নেই এবং কেবলমাত্র একটি অংশ আপডেট করা উচিত innerএটি সময়ের সাশ্রয় করার পাশাপাশি অল্প প্রচেষ্টা করার দরকার রয়েছে।অভ্যন্তরীণ এইচটিএমএল এর সর্বাধিক সুবিধা হ'ল ব্যবহারকারীর অভিজ্ঞতা যা এই বৈশিষ্ট্যটির সাথে উন্নত।

কিভাবে একটি জাভা প্রোগ্রাম প্রস্থান

দেখুন লিখেছেন এডুরেকা। ওয়েব ডেভেলপমেন্ট শংসাপত্র প্রশিক্ষণ আপনাকে এইচটিএমএল 5, সিএসএস 3, টুইটার বুটস্ট্র্যাপ 3, জ্যাকুয়ারি এবং গুগল এপিআই ব্যবহার করে কীভাবে চিত্তাকর্ষক ওয়েবসাইট তৈরি করতে শিখতে এবং এটি অ্যামাজন সিম্পল স্টোরেজ সার্ভিসে (এস 3) স্থাপন করতে সহায়তা করবে।

আমাদের জন্য একটি প্রশ্ন আছে? দয়া করে এটি 'জাভাস্ক্রিপ্টে স্ট্রিং কনক্যাটনেটেশন' এর মন্তব্য বিভাগে উল্লেখ করুন এবং আমরা আপনার কাছে ফিরে আসব।