{"version":"1.0","provider_name":"SAP Help, Training and Education","provider_url":"https:\/\/www.se80.co.uk\/training-education","author_name":"se80","author_url":"https:\/\/www.se80.co.uk\/training-education\/author\/se80\/","title":"Hide and display HTML element using Javascript - SAP Help, Training and Education","type":"rich","width":600,"height":338,"html":"<blockquote class=\"wp-embedded-content\" data-secret=\"6LwOHPJAvC\"><a href=\"https:\/\/www.se80.co.uk\/training-education\/hide-and-display-html-element-using-javascript\/\">Hide and display HTML element using Javascript<\/a><\/blockquote><iframe sandbox=\"allow-scripts\" security=\"restricted\" src=\"https:\/\/www.se80.co.uk\/training-education\/hide-and-display-html-element-using-javascript\/embed\/#?secret=6LwOHPJAvC\" width=\"600\" height=\"338\" title=\"&#8220;Hide and display HTML element using Javascript&#8221; &#8212; SAP Help, Training and Education\" data-secret=\"6LwOHPJAvC\" frameborder=\"0\" marginwidth=\"0\" marginheight=\"0\" scrolling=\"no\" class=\"wp-embedded-content\"><\/iframe><script type=\"text\/javascript\">\n\/*! This file is auto-generated *\/\n!function(c,d){\"use strict\";var e=!1,o=!1;if(d.querySelector)if(c.addEventListener)e=!0;if(c.wp=c.wp||{},c.wp.receiveEmbedMessage);else if(c.wp.receiveEmbedMessage=function(e){var t=e.data;if(!t);else if(!(t.secret||t.message||t.value));else if(\/[^a-zA-Z0-9]\/.test(t.secret));else{for(var r,s,a,i=d.querySelectorAll('iframe[data-secret=\"'+t.secret+'\"]'),n=d.querySelectorAll('blockquote[data-secret=\"'+t.secret+'\"]'),o=new RegExp(\"^https?:$\",\"i\"),l=0;l<n.length;l++)n[l].style.display=\"none\";for(l=0;l<i.length;l++)if(r=i[l],e.source!==r.contentWindow);else{if(r.removeAttribute(\"style\"),\"height\"===t.message){if(1e3<(s=parseInt(t.value,10)))s=1e3;else if(~~s<200)s=200;r.height=s}if(\"link\"===t.message)if(s=d.createElement(\"a\"),a=d.createElement(\"a\"),s.href=r.getAttribute(\"src\"),a.href=t.value,!o.test(a.protocol));else if(a.host===s.host)if(d.activeElement===r)c.top.location.href=t.value}}},e)c.addEventListener(\"message\",c.wp.receiveEmbedMessage,!1),d.addEventListener(\"DOMContentLoaded\",t,!1),c.addEventListener(\"load\",t,!1);function t(){if(o);else{o=!0;for(var e,t,r,s=-1!==navigator.appVersion.indexOf(\"MSIE 10\"),a=!!navigator.userAgent.match(\/Trident.*rv:11\\.\/),i=d.querySelectorAll(\"iframe.wp-embedded-content\"),n=0;n<i.length;n++){if(!(r=(t=i[n]).getAttribute(\"data-secret\")))r=Math.random().toString(36).substr(2,10),t.src+=\"#?secret=\"+r,t.setAttribute(\"data-secret\",r);if(s||a)(e=t.cloneNode(!0)).removeAttribute(\"security\"),t.parentNode.replaceChild(e,t);t.contentWindow.postMessage({message:\"ready\",secret:r},\"*\")}}}}(window,document);\n<\/script>\n","description":"Within the JavaScript of your SAP BSP application or standard web page\u00a0it is very simple to\u00a0toggle a\u00a0HTML element between hidden and display mode using the visibility attribute. You would just reference the elements ID and set the visibility attribute\u00a0to &#8216;hidden&#8217; or &#8216;visible&#8217;, see example below. HTML Code: &lt;a\u00a0id=&#8221;myBackButton&#8221;\u00a0href=&#8221;?OnInputProcessing(goback)&#8221;\u00a0class=&#8221;myButton&#8221;\u00a0\u00a0&gt;Back\u00a0to\u00a0Index&lt;\/a&gt; JavaScript Code: document.getElementById(&#8216;myBackButton&#8217;).style.visibility\u00a0=\u00a0&#8216;hidden&#8217;; or document.getElementById(&#8216;myBackButton&#8217;).style.visibility\u00a0=\u00a0&#8216;visible&#8217;;"}