يمكن استخدام التوابع واستدعاؤها في أماكن مختلفة

إخفاء نص عند الضغط على زر :

[php]
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title> show and hide </title>
</head>

<body>

<button onclick="hidetext();"> hide </button>

<p id="sh"> this text is visible right now </p>

<script>

function hidetext() {
document.getElementById("sh").style.display="none";
}

</script>
</body>

</html>
[/php]

إظهار نص عند الضغط على زر :

[php]
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title> show and hide </title>
</head>
<style>
#sh {
Display:none;
}
</style>
<body>

<button onclick="showtext();"> hide </button>

<p id="sh"> this text is visible right now </p>

<script>

function showtext() {
document.getElementById("sh").style.display="block";
}

</script>
</body>

</html>
[/php]

لنقم بإظهار النص بزر وإخفاءه بزر آخر

[php]
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title> show and hide </title>
</head>
<style>
#sh {
display:none;
}
</style>

<body>

<button onclick="showtext();"> show </button>

<section id="sh">
<p> this text is visible right now </p>
<button onclick="hidetext();"> hide </button>
</section>
<script>

function hidetext() {
document.getElementById("sh").style.display="none";
}

function showtext() {
document.getElementById("sh").style.display="block";
}

</script>
</body>

</html>

[/php]

تم إضافة الوسمsection

لأنه أصبح لدينا عنصرين يجب أن نقوم بإظهارهم وإخفاءهم , أحد الحلول هو تضمينهما بوسم آخر وهو إما section او div .. إلخ

جرب إضافة صورة إلى الـ section السابق