{"id":1560,"date":"2020-10-16T20:18:59","date_gmt":"2020-10-16T16:48:59","guid":{"rendered":"https:\/\/behnudi.ir\/?p=1560"},"modified":"2024-09-04T11:16:45","modified_gmt":"2024-09-04T07:46:45","slug":"js03-forms","status":"publish","type":"post","link":"https:\/\/behnudi.ir\/?p=1560","title":{"rendered":"\u062c\u0627\u0648\u0627\u0633\u06a9\u0631\u06cc\u067e\u062a: \u06f3- \u0641\u0631\u0645"},"content":{"rendered":"<h2>\u0641\u0631\u0645 &#8211; Forms<\/h2>\n<p>\u062f\u0631 HTML \u062a\u06af\u200c\u0647\u0627\u06cc \u0632\u06cc\u0627\u062f\u06cc \u0628\u0631\u0627\u06cc \u0633\u0627\u062e\u062a \u0641\u0631\u0645\u200c\u0647\u0627\u06cc \u0648\u0631\u0648\u062f\u06cc \u0648 \u062e\u0631\u0648\u062c\u06cc \u0648\u062c\u0648\u062f \u062f\u0627\u0631\u062f. \u0627\u06cc\u0646\u062c\u0627 \u0645\u06cc\u200c\u062e\u0648\u0627\u0647\u06cc\u0645 \u0628\u0627 \u0628\u0631\u062e\u06cc \u0627\u0632 \u0645\u0647\u0645\u062a\u0631\u06cc\u0646 \u0622\u0646\u200c\u0647\u0627 \u0622\u0634\u0646\u0627 \u0634\u0648\u06cc\u0645.<\/p>\n<div class=\"code-header\">HTML<\/div>\n<pre><code class=\"html\">\r\n&lt;form&gt;...&lt;\/form&gt;\r\n\r\n&lt;fieldset&gt;...&lt;\/fieldset&gt;\r\n&lt;legend&gt;...&lt;\/legend&gt;\r\n\r\n&lt;button&gt;...&lt;\/button&gt;\r\n&lt;input ... \/&gt;\r\n&lt;label&gt;...&lt;\/label&gt;\r\n&lt;textarea&gt;...&lt;\/textarea&gt;\r\n\r\n<\/code><\/pre>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-648\" src=\"https:\/\/behnudi.ir\/f\/js1\/03\/img\/signup_form.jpg\" \/><\/p>\n<hr \/>\n<p><video controls=\"controls\"><source src=\"https:\/\/behnudi.ir\/f\/js1\/03\/js1031.mp4\" type=\"video\/mp4\" \/>Your browser does not support the video tag.<\/video><\/p>\n<hr \/>\n<h4 dir=\"ltr\">&lt;button&gt;&#8230;&lt;\/button&gt;<\/h4>\n<p>\u0627\u0644\u0645\u0646\u062a \u0628\u0627\u062a\u0646 (button) \u06cc\u06a9 \u062f\u06a9\u0645\u0647 \u062f\u0631 \u0635\u0641\u062d\u0647 \u0627\u06cc\u062c\u0627\u062f \u0645\u06cc\u200c\u06a9\u0646\u062f\u060c \u06a9\u0647 \u0645\u06cc\u200c\u062a\u0648\u0627\u0646 \u0631\u0648\u06cc \u0622\u0646 \u06a9\u0644\u06cc\u06a9 \u06a9\u0631\u062f \u062a\u0627 \u06a9\u0627\u0631\u06cc \u0627\u0646\u062c\u0627\u0645 \u0634\u0648\u062f.<\/p>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-704\" src=\"https:\/\/behnudi.ir\/f\/js1\/03\/img\/button.png\" \/><\/p>\n<p>\u062f\u0631 \u0645\u062b\u0627\u0644 \u0632\u06cc\u0631 \u06cc\u06a9 \u067e\u06cc\u0627\u0645 \u0631\u0648\u06cc \u0635\u0641\u062d\u0647 \u0638\u0627\u0647\u0631 \u0645\u06cc\u200c\u0634\u0648\u062f \u0648 \u0633\u067e\u0633 \u0645\u062d\u062a\u0648\u0627\u06cc \u0627\u0644\u0645\u0646\u062a h1 \u062a\u063a\u06cc\u06cc\u0631 \u0645\u06cc\u200c\u06a9\u0646\u062f.<\/p>\n<div class=\"code-header\">HTML<\/div>\n<pre><code class=\"html\">\r\n&lt;h1 id=\"demo\"&gt;&lt;\/h1&gt;    \r\n&lt;button id=\"btn\"&gt;Click Here&lt;\/button&gt;\r\n\r\n<\/code><\/pre>\n<div class=\"code-header\">JS<\/div>\n<pre><code class=\"js\">\r\ndocument.getElementById(\"btn\").onclick = function() {\r\n    alert(\"Hi\");\r\n    document.getElementById(\"demo\").innerHTML = \"Hello, World!\";\r\n}\r\n\r\n<\/code><\/pre>\n<p><iframe loading=\"lazy\" src=\"https:\/\/behnudi.ir\/f\/js1\/03\/01\" width=\"500\" height=\"500\"><\/iframe><\/p>\n<hr \/>\n<p><video controls=\"controls\"><source src=\"https:\/\/behnudi.ir\/f\/js1\/03\/js1032.mp4\" type=\"video\/mp4\" \/>Your browser does not support the video tag.<\/video><\/p>\n<hr \/>\n<h4 dir=\"ltr\">&lt;input &#8230; &gt;<\/h4>\n<p>\u0627\u0644\u0645\u0646\u062a input \u0686\u06cc\u0632\u06cc \u0631\u0627 \u0627\u0632 \u06a9\u0627\u0631\u0628\u0631 \u062f\u0631\u06cc\u0627\u0641\u062a \u0645\u06cc\u200c\u06a9\u0646\u062f. \u0622\u0646 \u0686\u06cc\u0632 \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u062f \u0645\u062a\u0646\u060c \u0639\u062f\u062f \u06cc\u0627 &#8230; \u0628\u0627\u0634\u062f. \u0628\u0647 \u06a9\u0645\u06a9 Attribute \u0647\u0627\u06cc \u0622\u0646 \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u06cc\u062f \u0646\u0645\u0627 \u0648 \u0639\u0645\u0644\u06a9\u0631\u062f \u0622\u0646 \u0631\u0627 \u062a\u0639\u06cc\u06cc\u0646 \u06a9\u0646\u06cc\u062f.<\/p>\n<ul>\n<li>type: \u0646\u0648\u0639 \u0648\u0631\u0648\u062f\u06cc<\/li>\n<li>value: \u0645\u0642\u062f\u0627\u0631 \u0627\u0648\u0644\u06cc\u0647<\/li>\n<li>checked: \u0639\u0644\u0627\u0645\u062a \u062f\u0627\u0631<\/li>\n<li>name: \u0646\u0627\u0645 \u0627\u0644\u0645\u0646\u062a<\/li>\n<li>placeholder: \u0631\u0627\u0647\u0646\u0645\u0627\u06cc \u06a9\u0627\u0631\u0628\u0631<\/li>\n<\/ul>\n<h5>\u0627\u0646\u0648\u0627\u0639 input<\/h5>\n<p><iframe loading=\"lazy\" src=\"https:\/\/behnudi.ir\/f\/js1\/03\/00\" width=\"500\" height=\"500\"><\/iframe><\/p>\n<h5 dir=\"ltr\">&lt;input type=&#8221;text&#8221; \/&gt;<\/h5>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-705\" src=\"https:\/\/behnudi.ir\/f\/js1\/03\/img\/input-text.png\" \/><\/p>\n<h5 dir=\"ltr\">&lt;input type=&#8221;text&#8221; placeholder=&#8221;Name&#8221;\/&gt;<\/h5>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-707\" src=\"https:\/\/behnudi.ir\/f\/js1\/03\/img\/placeholder.png\" \/><\/p>\n<h5 dir=\"ltr\">&lt;input type=&#8221;text&#8221; value=&#8221;Mahdi Ahmadi&#8221;\/&gt;<\/h5>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-706\" src=\"https:\/\/behnudi.ir\/f\/js1\/03\/img\/input-value.png\" \/><\/p>\n<div class=\"code-header\">HTML<\/div>\n<pre><code class=\"html\">\r\n&lt;h1 id=\"demo\"&gt;&lt;\/h1&gt;    \r\n&lt;input type=\"text\" id=\"name-id\"&gt;\r\n&lt;button id=\"btn\"&gt;OK&lt;\/button&gt;\r\n\r\n<\/code><\/pre>\n<div class=\"code-header\">JS<\/div>\n<pre><code class=\"js\">\r\ndocument.getElementById(\"btn\").onclick = function() {\r\n\r\n    document.getElementById(\"demo\").innerHTML =\r\n    document.getElementById(\"name-id\").value;\r\n\r\n}\r\n\r\n<\/code><\/pre>\n<p><iframe loading=\"lazy\" src=\"https:\/\/behnudi.ir\/f\/js1\/03\/02\" width=\"500\" height=\"500\"><\/iframe><\/p>\n<hr \/>\n<p><video controls=\"controls\"><source src=\"https:\/\/behnudi.ir\/f\/js1\/03\/js1033.mp4\" type=\"video\/mp4\" \/>Your browser does not support the video tag.<\/video><\/p>\n<hr \/>\n<h4>\u062a\u0645\u0631\u06cc\u0646 \u06f1<\/h4>\n<ul>\n<li>\u0627\u06cc\u0646 <a href=\"https:\/\/behnudi.ir\/f\/js1\/03\/03-1.zip\">\u0641\u0627\u06cc\u0644<\/a>\u00a0\u0631\u0627 \u062f\u0627\u0646\u0644\u0648\u062f \u06a9\u0646\u06cc\u062f.<\/li>\n<li>\u0622\u0646 \u0631\u0627 \u062f\u0631 \u0641\u0648\u0644\u062f\u0631 js1 \u0628\u0627\u0632 \u06a9\u0646\u06cc\u062f.<\/li>\n<li>\u0641\u0627\u06cc\u0644 script.js \u0631\u0627 \u06a9\u0627\u0645\u0644 \u06a9\u0646\u06cc\u062f. \u0645\u0642\u062f\u0627\u0631 \u0648\u0627\u0631\u062f \u0634\u062f\u0647 \u0632\u06cc\u0631 \u0622\u0646 \u0646\u0645\u0627\u06cc\u0634 \u062f\u0627\u062f\u0647 \u0634\u0648\u062f.<\/li>\n<\/ul>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-708\" src=\"https:\/\/behnudi.ir\/f\/js1\/03\/img\/03-1.png\" \/><\/p>\n<hr \/>\n<h5 dir=\"ltr\">&lt;input type=&#8221;password&#8221; \/&gt;<\/h5>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-709\" src=\"https:\/\/behnudi.ir\/f\/js1\/03\/img\/input-pass.png\" \/><\/p>\n<div class=\"code-header\">HTML<\/div>\n<pre><code class=\"html\">\r\n&lt;h1 id=\"demo\"&gt;&lt;\/h1&gt;    \r\n&lt;input type=\"password\" id=\"pass-id\"&gt;\r\n&lt;button id=\"btn\"&gt;OK&lt;\/button&gt;\r\n\r\n<\/code><\/pre>\n<div class=\"code-header\">JS<\/div>\n<pre><code class=\"js\">\r\ndocument.getElementById(\"btn\").onclick = function() {\r\n\r\n    document.getElementById(\"demo\").innerHTML =\r\n    document.getElementById(\"pass-id\").value;\r\n\r\n}\r\n\r\n<\/code><\/pre>\n<p><iframe loading=\"lazy\" src=\"https:\/\/behnudi.ir\/f\/js1\/03\/03\" width=\"500\" height=\"500\"><\/iframe><\/p>\n<hr \/>\n<p><video controls=\"controls\"><source src=\"https:\/\/behnudi.ir\/f\/js1\/03\/js1034.mp4\" type=\"video\/mp4\" \/>Your browser does not support the video tag.<\/video><\/p>\n<hr \/>\n<h4>\u062a\u0645\u0631\u06cc\u0646 \u06f2<\/h4>\n<ul>\n<li>\u0627\u06cc\u0646 <a href=\"https:\/\/behnudi.ir\/f\/js1\/03\/03-2.zip\">\u0641\u0627\u06cc\u0644<\/a>\u00a0\u0631\u0627 \u062f\u0627\u0646\u0644\u0648\u062f \u06a9\u0646\u06cc\u062f.<\/li>\n<li>\u0622\u0646 \u0631\u0627 \u062f\u0631 \u0641\u0648\u0644\u062f\u0631 js1 \u0628\u0627\u0632 \u06a9\u0646\u06cc\u062f.<\/li>\n<li>\u0641\u0627\u06cc\u0644 script.js \u0631\u0627 \u06a9\u0627\u0645\u0644 \u06a9\u0646\u06cc\u062f. \u0645\u0642\u062f\u0627\u0631 \u0648\u0627\u0631\u062f \u0634\u062f\u0647 \u0632\u06cc\u0631 \u0622\u0646 \u0646\u0645\u0627\u06cc\u0634 \u062f\u0627\u062f\u0647 \u0634\u0648\u062f.<\/li>\n<\/ul>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-710\" src=\"https:\/\/behnudi.ir\/f\/js1\/03\/img\/03-2.png\" \/><\/p>\n<hr \/>\n<h5 dir=\"ltr\">&lt;input type=&#8221;number&#8221; \/&gt;<\/h5>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-711\" src=\"https:\/\/behnudi.ir\/f\/js1\/03\/img\/input-num.png\" \/><\/p>\n<h5 dir=\"ltr\">&lt;input type=&#8221;number&#8221; min=&#8221;0&#8243; max=&#8221;50&#8243; step=&#8221;5&#8243; &gt;<\/h5>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-711\" src=\"https:\/\/behnudi.ir\/f\/js1\/03\/img\/input-num.png\" \/><\/p>\n<div class=\"code-header\">HTML<\/div>\n<pre><code class=\"html\">\r\n&lt;h1 id=\"demo\"&gt;&lt;\/h1&gt;\r\n&lt;input type=\"number\" id=\"num-id\"&gt;\r\n&lt;button id=\"btn\"&gt;OK&lt;\/button&gt;\r\n\r\n<\/code><\/pre>\n<div class=\"code-header\">JS<\/div>\n<pre><code class=\"js\">\r\ndocument.getElementById(\"btn\").onclick = function() {\r\n\r\n    document.getElementById(\"demo\").innerHTML =\r\n    document.getElementById(\"num-id\").value;\r\n\r\n}\r\n\r\n<\/code><\/pre>\n<p><iframe loading=\"lazy\" src=\"https:\/\/behnudi.ir\/f\/js1\/03\/04\" width=\"500\" height=\"500\"><\/iframe><\/p>\n<hr \/>\n<p><video controls=\"controls\"><span data-mce-type=\"bookmark\" style=\"display: inline-block; width: 0px; overflow: hidden; line-height: 0;\" class=\"mce_SELRES_start\">\ufeff<\/span><source src=\"https:\/\/behnudi.ir\/f\/js1\/03\/js1035.mp4\" type=\"video\/mp4\" \/><span data-mce-type=\"bookmark\" style=\"display: inline-block; width: 0px; overflow: hidden; line-height: 0;\" class=\"mce_SELRES_end\">\ufeff<\/span><br \/>\nYour browser does not support the video tag.<\/video><\/p>\n<hr \/>\n<h4>\u062a\u0645\u0631\u06cc\u0646 \u06f3<\/h4>\n<ul>\n<li>\u0627\u06cc\u0646 <a href=\"https:\/\/behnudi.ir\/f\/js1\/03\/03-3.zip\">\u0641\u0627\u06cc\u0644<\/a>\u00a0\u0631\u0627 \u062f\u0627\u0646\u0644\u0648\u062f \u06a9\u0646\u06cc\u062f.<\/li>\n<li>\u0622\u0646 \u0631\u0627 \u062f\u0631 \u0641\u0648\u0644\u062f\u0631 js1 \u0628\u0627\u0632 \u06a9\u0646\u06cc\u062f.<\/li>\n<li>\u0641\u0627\u06cc\u0644 script.js \u0631\u0627 \u06a9\u0627\u0645\u0644 \u06a9\u0646\u06cc\u062f. \u0645\u0642\u062f\u0627\u0631 \u0648\u0627\u0631\u062f \u0634\u062f\u0647 \u0632\u06cc\u0631 \u0622\u0646 \u0646\u0645\u0627\u06cc\u0634 \u062f\u0627\u062f\u0647 \u0634\u0648\u062f.<\/li>\n<\/ul>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-712\" src=\"https:\/\/behnudi.ir\/f\/js1\/03\/img\/03-3.png\"\/><\/p>\n<hr \/>\n<h5 dir=\"ltr\">&lt;input type=&#8221;range&#8221; \/&gt;<\/h5>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-713\" src=\"https:\/\/behnudi.ir\/f\/js1\/03\/img\/input-rng.png\"\/><\/p>\n<div class=\"code-header\">HTML<\/div>\n<pre><code class=\"html\">\r\n&lt;h1 id=\"demo\"&gt;&lt;\/h1&gt;\r\n&lt;input type=\"range\" id=\"rng-id\"&gt;\r\n&lt;button id=\"btn\"&gt;OK&lt;\/button&gt;\r\n\r\n<\/code><\/pre>\n<div class=\"code-header\">JS<\/div>\n<pre><code class=\"js\">\r\ndocument.getElementById(\"btn\").onclick = function() {\r\n\r\n    document.getElementById(\"demo\").innerHTML = \r\n    document.getElementById(\"rng-id\").value;\r\n\r\n}\r\n\r\n<\/code><\/pre>\n<p><iframe loading=\"lazy\" src=\"https:\/\/behnudi.ir\/f\/js1\/03\/05\" width=\"500\" height=\"500\"><\/iframe><\/p>\n<hr \/>\n<p><video controls=\"controls\"><source src=\"https:\/\/behnudi.ir\/f\/js1\/03\/js1036.mp4\" type=\"video\/mp4\" \/>Your browser does not support the video tag.<\/video><\/p>\n<hr \/>\n<h4>\u062a\u0645\u0631\u06cc\u0646 \u06f4<\/h4>\n<ul>\n<li>\u0627\u06cc\u0646 <a href=\"https:\/\/behnudi.ir\/f\/js1\/03\/03-4.zip\">\u0641\u0627\u06cc\u0644<\/a>\u00a0\u0631\u0627 \u062f\u0627\u0646\u0644\u0648\u062f \u06a9\u0646\u06cc\u062f.<\/li>\n<li>\u0622\u0646 \u0631\u0627 \u062f\u0631 \u0641\u0648\u0644\u062f\u0631 js1 \u0628\u0627\u0632 \u06a9\u0646\u06cc\u062f.<\/li>\n<li>\u0641\u0627\u06cc\u0644 script.js \u0631\u0627 \u06a9\u0627\u0645\u0644 \u06a9\u0646\u06cc\u062f. \u0645\u0642\u062f\u0627\u0631 \u0648\u0627\u0631\u062f \u0634\u062f\u0647 \u0632\u06cc\u0631 \u0622\u0646 \u0646\u0645\u0627\u06cc\u0634 \u062f\u0627\u062f\u0647 \u0634\u0648\u062f.<\/li>\n<\/ul>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-714\" src=\"https:\/\/behnudi.ir\/f\/js1\/03\/img\/03-4.png\" \/><\/p>\n<hr \/>\n<h5 dir=\"ltr\">&lt;input type=&#8221;checkbox&#8221; \/&gt;<\/h5>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-715\" src=\"https:\/\/behnudi.ir\/f\/js1\/03\/img\/input-chkbx.png\" \/><\/p>\n<h5 dir=\"ltr\">&lt;input type=&#8221;checkbox&#8221; checked \/&gt;<\/h5>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-715\" src=\"https:\/\/behnudi.ir\/f\/js1\/03\/img\/input-chkbx.png\" \/><\/p>\n<div class=\"code-header\">HTML<\/div>\n<pre><code class=\"html\">\r\n&lt;h1 id=\"demo\"&gt;&lt;\/h1&gt;\r\n&lt;input type=\"checkbox\" id=\"chkbx-id\"&gt;\r\n&lt;button id=\"btn\"&gt;OK&lt;\/button&gt;\r\n\r\n<\/code><\/pre>\n<div class=\"code-header\">JS<\/div>\n<pre><code class=\"js\">\r\ndocument.getElementById(\"btn\").onclick = function() {\r\n\r\n    document.getElementById(\"demo\").innerHTML =\r\n    document.getElementById(\"chkbx-id\").checked;\r\n\r\n}\r\n\r\n<\/code><\/pre>\n<p><iframe loading=\"lazy\" src=\"https:\/\/behnudi.ir\/f\/js1\/03\/06\" width=\"500\" height=\"500\"><\/iframe><\/p>\n<hr \/>\n<p><video controls=\"controls\"><span data-mce-type=\"bookmark\" style=\"display: inline-block; width: 0px; overflow: hidden; line-height: 0;\" class=\"mce_SELRES_start\">\ufeff<\/span><source src=\"https:\/\/behnudi.ir\/f\/js1\/03\/js1037.mp4\" type=\"video\/mp4\" \/><span data-mce-type=\"bookmark\" style=\"display: inline-block; width: 0px; overflow: hidden; line-height: 0;\" class=\"mce_SELRES_end\">\ufeff<\/span><br \/>\nYour browser does not support the video tag.<\/video><\/p>\n<hr \/>\n<h4>\u062a\u0645\u0631\u06cc\u0646 \u06f5<\/h4>\n<ul>\n<li>\u0627\u06cc\u0646 <a href=\"https:\/\/behnudi.ir\/f\/js1\/03\/03-5.zip\">\u0641\u0627\u06cc\u0644<\/a>\u00a0\u0631\u0627 \u062f\u0627\u0646\u0644\u0648\u062f \u06a9\u0646\u06cc\u062f.<\/li>\n<li>\u0622\u0646 \u0631\u0627 \u062f\u0631 \u0641\u0648\u0644\u062f\u0631 js1 \u0628\u0627\u0632 \u06a9\u0646\u06cc\u062f.<\/li>\n<li>\u0641\u0627\u06cc\u0644 script.js \u0631\u0627 \u06a9\u0627\u0645\u0644 \u06a9\u0646\u06cc\u062f. \u0645\u0642\u062f\u0627\u0631 \u0648\u0627\u0631\u062f \u0634\u062f\u0647 \u0632\u06cc\u0631 \u0622\u0646 \u0646\u0645\u0627\u06cc\u0634 \u062f\u0627\u062f\u0647 \u0634\u0648\u062f.<\/li>\n<\/ul>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-716\" src=\"https:\/\/behnudi.ir\/f\/js1\/03\/img\/03-5.png\" \/><\/p>\n<hr \/>\n<h5 dir=\"ltr\">&lt;input type=&#8221;checkbox&#8221; checked \/&gt;<\/h5>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-715\" src=\"https:\/\/behnudi.ir\/f\/js1\/03\/img\/input-chkbx.png\" \/><\/p>\n<div class=\"code-header\">HTML<\/div>\n<pre><code class=\"html\">\r\n&lt;h1 id=\"demo\"&gt;&lt;\/h1&gt;\r\n&lt;input type=\"checkbox\" id=\"chkbx-id\"&gt;\r\n&lt;button id=\"btn\"&gt;OK&lt;\/button&gt;\r\n\r\n<\/code><\/pre>\n<div class=\"code-header\">JS<\/div>\n<pre><code class=\"js\">\r\ndocument.getElementById(\"btn\").onclick = function() {\r\n\r\n    document.getElementById(\"demo\").innerHTML =\r\n    document.getElementById(\"chkbx-id\").checked;\r\n\r\n}\r\n\r\n<\/code><\/pre>\n<p><iframe loading=\"lazy\" src=\"https:\/\/behnudi.ir\/f\/js1\/03\/06\" width=\"500\" height=\"500\"><\/iframe><\/p>\n<hr \/>\n<h5 dir=\"ltr\">&lt;label for=&#8221;id&#8221;&gt;&#8230;&lt;\/label\/&gt;<\/h5>\n<div class=\"code-header\">HTML<\/div>\n<pre><code class=\"html\">\r\n&lt;!-- inaccessible --&gt;\r\n&lt;input id=\"g1\" type=\"checkbox\"&gt;Cricket\r\n\r\n\r\n&lt;!-- implicit label --&gt;\r\n&lt;label&gt;&lt;input id=\"g2\" type=\"checkbox\"&gt;Hockey&lt;\/label&gt;\r\n\r\n\r\n&lt;!-- explicit label --&gt;\r\n&lt;input id=\"g3\" type=\"checkbox\"&gt;&lt;label for=\"g3\"&gt;Rugby&lt;\/label&gt;\r\n\r\n<\/code><\/pre>\n<p><iframe loading=\"lazy\" src=\"https:\/\/behnudi.ir\/f\/js1\/03\/07\" width=\"500\" height=\"500\"><\/iframe><\/p>\n<h4>\u062a\u0645\u0631\u06cc\u0646 \u06f6<\/h4>\n<ul>\n<li>\u0627\u06cc\u0646 <a href=\"https:\/\/behnudi.ir\/f\/js1\/03\/03-6.zip\">\u0641\u0627\u06cc\u0644<\/a>\u00a0\u0631\u0627 \u062f\u0627\u0646\u0644\u0648\u062f \u06a9\u0646\u06cc\u062f.<\/li>\n<li>\u0622\u0646 \u0631\u0627 \u062f\u0631 \u0641\u0648\u0644\u062f\u0631 js1 \u0628\u0627\u0632 \u06a9\u0646\u06cc\u062f.<\/li>\n<li>\u0641\u0627\u06cc\u0644 script.js \u0631\u0627 \u06a9\u0627\u0645\u0644 \u06a9\u0646\u06cc\u062f. \u0645\u0642\u062f\u0627\u0631 \u0648\u0627\u0631\u062f \u0634\u062f\u0647 \u0632\u06cc\u0631 \u0622\u0646 \u0646\u0645\u0627\u06cc\u0634 \u062f\u0627\u062f\u0647 \u0634\u0648\u062f.<\/li>\n<\/ul>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-718\" src=\"https:\/\/behnudi.ir\/f\/js1\/03\/img\/03-6.png\" \/><\/p>\n<hr \/>\n<h5 dir=\"ltr\">&lt;input type=&#8221;radio&#8221; \/&gt;<\/h5>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-717\" src=\"https:\/\/behnudi.ir\/f\/js1\/03\/img\/input-radio.png\" \/><\/p>\n<div class=\"code-header\">HTML<\/div>\n<pre><code class=\"html\">\r\n&lt;h1 id=\"demo\"&gt;&lt;\/h1&gt;\r\n&lt;input type=\"radio\" id=\"rdo-id\"&gt;\r\n&lt;button id=\"btn\"&gt;OK&lt;\/button&gt;\r\n\r\n<\/code><\/pre>\n<div class=\"code-header\">JS<\/div>\n<pre><code class=\"js\">\r\ndocument.getElementById(\"btn\").onclick = function() {\r\n\r\n    document.getElementById(\"demo\").innerHTML =\r\n    document.getElementById(\"rdo-id\").checked;\r\n\r\n}\r\n\r\n<\/code><\/pre>\n<p><iframe loading=\"lazy\" src=\"https:\/\/behnudi.ir\/f\/js1\/03\/08\" width=\"500\" height=\"500\"><\/iframe><\/p>\n<hr \/>\n<h5 dir=\"ltr\">&lt;input type=&#8221;radio&#8221; name=&#8221;group&#8221; \/&gt;<\/h5>\n<p><img decoding=\"async\" class=\"aligncenter size-full wp-image-719\" src=\"https:\/\/behnudi.ir\/f\/js1\/03\/img\/input-name.png\" \/><\/p>\n<div class=\"code-header\">HTML<\/div>\n<pre><code class=\"html\">\r\n&lt;!-- Group 1 --&gt;\r\n&lt;input type=\"radio\" name=\"grp1\" value=\"Cricket\"&gt;\r\n&lt;input type=\"radio\" name=\"grp1\" value=\"Hockey\"&gt;\r\n&lt;input type=\"radio\" name=\"grp1\" value=\"Rugby\"&gt;\r\n\r\n&lt;!------------------------------------&gt;\r\n\r\n&lt;!-- Group 2 --&gt;\r\n&lt;input type=\"radio\" name=\"grp2\" value=\"Red\"&gt;\r\n&lt;input type=\"radio\" name=\"grp2\" value=\"Blue\"&gt;\r\n&lt;input type=\"radio\" name=\"grp2\" value=\"Green\"&gt;\r\n\r\n<\/code><\/pre>\n<p><iframe loading=\"lazy\" src=\"https:\/\/behnudi.ir\/f\/js1\/03\/09\" width=\"500\" height=\"500\"><\/iframe><\/p>\n<hr \/>\n<h5 dir=\"ltr\">&lt;fieldset&gt;&#8230;&lt;\/fieldset&gt;<\/h5>\n<p>\u06cc\u06a9 \u062e\u0637 \u062f\u0648\u0631 \u0645\u062c\u0645\u0648\u0639\u0647\u200c\u06cc \u0627\u0644\u0645\u0646\u062a\u200c\u0647\u0627\u06cc \u062f\u0627\u062e\u0644 \u0622\u0646 \u06a9\u0634\u06cc\u062f\u0647 \u0645\u06cc \u0634\u0648\u062f.<\/p>\n<h5 dir=\"ltr\">&lt;legend&gt;&#8230;&lt;\/legend&gt;<\/h5>\n<p>\u06cc\u06a9 \u0639\u0646\u0648\u0627\u0646 \u0628\u0631\u0627\u06cc \u0622\u0646 \u0645\u062c\u0645\u0648\u0639\u0647 \u0646\u0645\u0627\u06cc\u0634 \u062f\u0627\u062f\u0647 \u0645\u06cc\u200c\u0634\u0648\u062f.<\/p>\n<div class=\"code-header\">HTML<\/div>\n<pre><code class=\"html\">\r\n<mark>&lt;fieldset&gt;<\/mark>\r\n    <mark>&lt;legend&gt;Choose a game:&lt;\/legend&gt;<\/mark>\r\n    &lt;p&gt;\r\n        &lt;input type=\"radio\" name=\"grp1\" id=\"game1\" value=\"Cricket\"&gt;\r\n        &lt;label for=\"game1\"&gt;Cricket&lt;\/label&gt;\r\n    &lt;\/p&gt;\r\n    &lt;p&gt;\r\n        &lt;input type=\"radio\" name=\"grp1\" id=\"game2\" value=\"Hockey\"&gt;\r\n        &lt;label for=\"game2\"&gt;Hockey&lt;\/label&gt;\r\n    &lt;\/p&gt;\r\n    &lt;p&gt;\r\n        &lt;input type=\"radio\" name=\"grp1\" id=\"game3\" value=\"Rugby\"&gt;\r\n        &lt;label for=\"game3\"&gt;Rugby&lt;\/label&gt;\r\n    &lt;\/p&gt;\r\n<mark>&lt;\/fieldset&gt;<\/mark>\r\n...\r\n\r\n<\/code><\/pre>\n<p><iframe loading=\"lazy\" src=\"https:\/\/behnudi.ir\/f\/js1\/03\/10\" width=\"500\" height=\"500\"><\/iframe><\/p>\n<hr \/>\n<p><video controls=\"controls\"><source src=\"https:\/\/behnudi.ir\/f\/js1\/03\/js1038.mp4\" type=\"video\/mp4\" \/>Your browser does not support the video tag.<\/video><\/p>\n<hr \/>\n","protected":false},"excerpt":{"rendered":"<p>\u0641\u0631\u0645 &#8211; Forms \u062f\u0631 HTML \u062a\u06af\u200c\u0647\u0627\u06cc \u0632\u06cc\u0627\u062f\u06cc \u0628\u0631\u0627\u06cc \u0633\u0627\u062e\u062a \u0641\u0631\u0645\u200c\u0647\u0627\u06cc \u0648\u0631\u0648\u062f\u06cc \u0648 \u062e\u0631\u0648\u062c\u06cc \u0648\u062c\u0648\u062f \u062f\u0627\u0631\u062f. \u0627\u06cc\u0646\u062c\u0627 \u0645\u06cc\u200c\u062e\u0648\u0627\u0647\u06cc\u0645 \u0628\u0627 \u0628\u0631\u062e\u06cc \u0627\u0632 \u0645\u0647\u0645\u062a\u0631\u06cc\u0646 \u0622\u0646\u200c\u0647\u0627 \u0622\u0634\u0646\u0627 \u0634\u0648\u06cc\u0645. HTML &lt;form&gt;&#8230;&lt;\/form&gt; &lt;fieldset&gt;&#8230;&lt;\/fieldset&gt; &lt;legend&gt;&#8230;&lt;\/legend&gt; &lt;button&gt;&#8230;&lt;\/button&gt; &lt;input &#8230; \/&gt; &lt;label&gt;&#8230;&lt;\/label&gt; &lt;textarea&gt;&#8230;&lt;\/textarea&gt; Your browser does not support the video tag. &lt;button&gt;&#8230;&lt;\/button&gt; \u0627\u0644\u0645\u0646\u062a \u0628\u0627\u062a\u0646 (button) \u06cc\u06a9 \u062f\u06a9\u0645\u0647 \u062f\u0631 \u0635\u0641\u062d\u0647 \u0627\u06cc\u062c\u0627\u062f \u0645\u06cc\u200c\u06a9\u0646\u062f\u060c \u06a9\u0647 \u0645\u06cc\u200c\u062a\u0648\u0627\u0646 \u0631\u0648\u06cc [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":1530,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[20],"tags":[46,44],"class_list":["post-1560","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-computer-science","tag-javascript","tag-web-design"],"_links":{"self":[{"href":"https:\/\/behnudi.ir\/index.php?rest_route=\/wp\/v2\/posts\/1560","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/behnudi.ir\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/behnudi.ir\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/behnudi.ir\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/behnudi.ir\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1560"}],"version-history":[{"count":0,"href":"https:\/\/behnudi.ir\/index.php?rest_route=\/wp\/v2\/posts\/1560\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/behnudi.ir\/index.php?rest_route=\/wp\/v2\/media\/1530"}],"wp:attachment":[{"href":"https:\/\/behnudi.ir\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1560"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/behnudi.ir\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=1560"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/behnudi.ir\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=1560"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}