Heim > Artikel > Web-Frontend > Native js implementiert Methoden zum Senden von Kommentaren und zum Anzeigen der Auswirkungen von Kommentaren (Codebeispiel).
In diesem Artikel wird Ihnen die Methode zum Senden von Kommentaren und zum Anzeigen der Wirkung von Kommentaren in nativem JS vorgestellt (Codebeispiel). Es hat einen gewissen Referenzwert. Freunde in Not können sich darauf beziehen. Ich hoffe, es wird Ihnen hilfreich sein.
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <style> #box{ width: 900px; margin: 0 auto; } #text{ width: 900px; height: 400px; margin: 0 auto; background-color: #fbe1c8; margin-top: 60px; outline: none; border-radius: 8px; border:2px solid #e59a56; overflow: hidden; } #tup{ float: right; display: block; margin-top: 10px; margin-left: 20px; width: 60px; height: 36px; background-color: #e69b57; font-size: 18px; line-height: 36px; border-radius: 6px; text-align: center; color: #ffffff; cursor:pointer; } #wad{ margin-top: 60px; width: 880px; } #wad p{ font-size: 18px; line-height: 24px; border-bottom: 1px dashed #e69b57; word-wrap: break-word; } </style> </head> <body> <div id="box"> <div id="text" contenteditable="true"></div> <span id="tup">提交</span> <div id="wad"></div> </div> <script> let Text = document.getElementById('text'), Tup = document.getElementById("tup"), Pl = document.getElementById("wad"); Tup.onclick = function(){ Li = "<p>" + Text.innerHTML + "</p>"; Text.innerHTML = ""; Pl.innerHTML += Li ; } </script> </body> </html>
Rendering:
Das obige ist der detaillierte Inhalt vonNative js implementiert Methoden zum Senden von Kommentaren und zum Anzeigen der Auswirkungen von Kommentaren (Codebeispiel).. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!