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

জাভাস্ক্রিপ্ট HTML পৃষ্ঠাগুলি আরও গতিশীল এবং ইন্টারেক্টিভ করে।

নিজে চেষ্টা করুন

এইচটিএমএল <script> ট্যাগ

এইচটিএমএল <script> ট্যাগটি ক্লায়েন্ট-সাইড স্ক্রিপ্ট (জাভাস্ক্রিপ্ট) সংজ্ঞায়িত করতে ব্যবহৃত হয়।

<script> এলিমেন্টটিতে স্ক্রিপ্ট স্টেটমেন্ট থাকে, অথবা এটি src অ্যাট্রিবিউটর মাধ্যমে কোনও বাহ্যিক স্ক্রিপ্ট ফাইলের দিকে নির্দেশ করে।

ওয়েবপেজে জাভাস্ক্রিপ্টের সাধারণ ব্যবহার গুলি হ’ল চিত্রের হেরফের, ফর্ম ভেলিডেশন এবং ওয়েব কক্টেন্ট গতিময় পরিবর্তন।

এইচটিএমএল এলিমেন্ট নির্বাচন করতে, জাভাস্ক্রিপ্ট বেশিরভাগ ক্ষেত্রে ব্যবহার করে document.getElementById() method

চলুন দেখি জাভাস্ক্রিপ্ট উদাহরণ এ কিভাবে   “হ্যালো জাভাস্ক্রিপ্ট!” একটি ID এর মধ্যে প্রবেশ করানো যায় ।

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
<script>
document.getElementById("demo").innerHTML = "হ্যালো জাভাস্ক্রিপ্ট!";
</script>
<script> document.getElementById("demo").innerHTML = "হ্যালো জাভাস্ক্রিপ্ট!"; </script>
<script>
  document.getElementById("demo").innerHTML = "হ্যালো জাভাস্ক্রিপ্ট!";
</script>

নিজে চেষ্টা করুন

নোট: জাভাস্ক্রিপ্ট  এর আলাদা টিউটোরিয়াল এ আপনারা আরো বিস্তারিত আকারে জাভাস্ক্রিপ্ট শিখতে পারবেন

JavaScript টেস্ট করা

জাভাস্ক্রিপ্ট কী কী করতে পারে তার কয়েকটি উদাহরণ এখানে রয়েছে:

উদাহরণ

জাভাস্ক্রিপ্ট কন্টেন্ট পরিবর্তন করতে পারে:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
<script>
document.getElementById("demo").innerHTML = "হ্যালো জাভাস্ক্রিপ্ট!";
</script>
<script> document.getElementById("demo").innerHTML = "হ্যালো জাভাস্ক্রিপ্ট!"; </script>
<script>
  document.getElementById("demo").innerHTML = "হ্যালো জাভাস্ক্রিপ্ট!";
</script>

নিজে চেষ্টা করুন

উদাহরণ

জাভাস্ক্রিপ্ট স্টাইল পরিবর্তন করতে পারে:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
document.getElementById("demo").style.fontSize = "30px";
document.getElementById("demo").style.color = "yellow";
document.getElementById("demo").style.backgroundColor = "black";
document.getElementById("demo").style.fontSize = "30px"; document.getElementById("demo").style.color = "yellow"; document.getElementById("demo").style.backgroundColor = "black";
document.getElementById("demo").style.fontSize = "30px";
document.getElementById("demo").style.color = "yellow";
document.getElementById("demo").style.backgroundColor = "black";

নিজে চেষ্টা করুন

 

উদাহরণ

JavaScript attribute ও পরিবর্তন করতে পারে ।  নিচের ইমেজ টি জন্য দুটি বাটব ব্যবহার করা হয়েছে এবং দেখুন যে ইমেজ টি বদল হয়ে যাচ্ছে এবং আপনার একটি মজার অভিজ্ঞতা হবে ।

black bulb

কোড দেখুন

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
document.getElementById("newImage").src= "color-bulb.png";
document.getElementById("newImage").src= "color-bulb.png";
document.getElementById("newImage").src= "color-bulb.png";

নিজে চেষ্টা করুন

HTML <noscript> Tag

HTML <noscript> tag টি ব্রাউজারে যদি জাভাস্ক্রিপ্ট সমর্থন না করে, তখন একটি মেসেজ ব্রাউজারে দেখায় ।

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
<script>
document.getElementById("demo").innerHTML = "Hello JavaScript!";
</script>
<noscript>Sorry, your browser does not support JavaScript!</noscript>
<script> document.getElementById("demo").innerHTML = "Hello JavaScript!"; </script> <noscript>Sorry, your browser does not support JavaScript!</noscript>
<script>
document.getElementById("demo").innerHTML = "Hello JavaScript!";
</script>
<noscript>Sorry, your browser does not support JavaScript!</noscript>

 

কমেন্ট করুন

Your email address will not be published. Required fields are marked *