Code remove [style, id, class] từ textarea bằng javascript 20/12/2017 | Cập nhật: 03/04/2020 Kelvin Khanh 135 Có thể bạn thích ? Mã ký tự đặt biệt trong HTML Minify Html trong ASP.NET mvc 5 Code resize image theo parrent tag (thẻ chứa image) bằng javascript htmlcssjsdownloadDemoCode by ThichCode.NET <!-- Code by ThichCode.NET --> <div class="modal" id="myModal"> <div class="modal-content"> <span class="close">×</span> <br /> <div id="result"></div> </div> </div> <textarea id="stringHTML" style="height: 400px; margin-bottom: 20px; width: 100%;"></textarea> <button class="btn btn-success" id="stripHTML">Remove [style, class, id]</button> <button class="btn btn-info" id="openResult">Open Result</button> <button class="btn btn-link" onclick="copyToClipboard(document.getElementById('stringHTML').innerHTML)">Copy</button> <!-- Code by ThichCode.NET --> <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous"> <style> /* The Modal (background) */ .modal { display: none; /* Hidden by default */ position: fixed; /* Stay in place */ z-index: 1; /* Sit on top */ left: 0; top: 0; width: 100%; /* Full width */ height: 100%; /* Full height */ overflow: auto; /* Enable scroll if needed */ background-color: rgb(0, 0, 0); /* Fallback color */ background-color: rgba(0, 0, 0, 0.4); /* Black w/ opacity */ } /* Modal Content/Box */ .modal-content { background-color: #fefefe; margin: 15% auto; /* 15% from the top and centered */ padding: 20px; border: 1px solid #888; width: 80%; /* Could be more or less, depending on screen size */ } /* The Close Button */ .close { color: #aaa; float: right; font-size: 28px; font-weight: bold; } .close:hover, .close:focus { color: black; text-decoration: none; cursor: pointer; } </style> <!-- Code by ThichCode.NET --> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script> <script> function copyToClipboard(text) { if (window.clipboardData && window.clipboardData.setData) { // IE specific code path to prevent textarea being shown while dialog is visible. return clipboardData.setData("Text", text); } else if (document.queryCommandSupported && document.queryCommandSupported("copy")) { var textarea = document.getElementById('stringHTML'); textarea.textContent = text; //textarea.style.position = "fixed"; // Prevent scrolling to bottom of page in MS Edge. //document.body.appendChild(textarea); textarea.select(); try { return document.execCommand("copy"); // Security exception may be thrown by some browsers. } catch (ex) { console.warn("Copy to clipboard failed.", ex); return false; } finally { //document.body.removeChild(textarea); } } } $('button#stripHTML').click(function() { var stringHTML = $('textarea#stringHTML').val(); //alert(stringHTML); //var e = $(stringHTML); $('#result').empty().append($.parseHTML(stringHTML)); //alert(e.outerHTML); $('#result').find('[style]').removeAttr('style'); $('#result').find('[class]').removeAttr('class'); $('#result').find('[id]').removeAttr('id'); $('textarea#stringHTML').val($('#result').html()); }); // Get the modal var modal = document.getElementById('myModal'); // Get the button that opens the modal var btn = document.getElementById("openResult"); // Get the <span> element that closes the modal var span = document.getElementsByClassName("close")[0]; // When the user clicks on the button, open the modal btn.onclick = function() { modal.style.display = "block"; } // When the user clicks on <span> (x), close the modal span.onclick = function() { modal.style.display = "none"; } window.onclick = function(event) { if (event.target == modal) { modal.style.display = "none"; } } </script> Result