Guest User

Untitled

a guest
Feb 17th, 2019
101
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.27 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="viewport" content="width=device-width">
  6. <title>JS Bin</title>
  7. <style id="jsbin-css">
  8. #Main{
  9. background: black;
  10. margin: 0 auto;
  11. display: block;
  12. width: 400px;
  13. height: 300px;
  14. border:solid;
  15. border-color: grey;
  16. text-align:center;
  17. }
  18. #btn{
  19. width: 100px;
  20. height:25px;
  21. color: white;
  22. background: red;
  23. border: solid;
  24. border-color: grey;
  25. }
  26. p{
  27. font-size: 20px;
  28. color: white;
  29. }
  30. body{
  31. background: url("");
  32. }
  33. </style>
  34. </head>
  35. <body>
  36. <div id="Main">
  37. <h1>This is my input</h1>
  38. <input id="inpt1" placeholder="Name 1"><br>
  39. <input id="inpt2" placeholder="Name 2"><br>
  40. <button id="btn" onclick="u()">Result</button>
  41. <p class="target1" id="resultFirst"></p>
  42. <p class="target2" id="resultLast"></p>
  43. </div>
  44. <script id="jsbin-javascript">
  45. function u(){
  46. var N1 = document.getElementById("inpt1").value;
  47. var N2 = document.getElementById("inpt2").value;
  48. document.querySelector(".target1").innerHTML = (N1);
  49. document.querySelector(".target2").innerHTML = (N2);
  50. console.log("N1");
  51. window.sessionStorage.setItem("first", N1);
  52. window.localStorage.last = N2;
  53. }
  54. document.getElementById("resultFirst").innerHTML = window.sessionStorage.getItem('first');
  55. document.getElementById("resultLast").innerHTML = window.localStorage.last;
  56. </script>
  57.  
  58.  
  59. <script id="jsbin-source-css" type="text/css">#Main{
  60. background: black;
  61. margin: 0 auto;
  62. display: block;
  63. width: 400px;
  64. height: 300px;
  65. border:solid;
  66. border-color: grey;
  67. text-align:center;
  68. }
  69. #btn{
  70. width: 100px;
  71. height:25px;
  72. color: white;
  73. background: red;
  74. border: solid;
  75. border-color: grey;
  76. }
  77. p{
  78. font-size: 20px;
  79. color: white;
  80. }
  81. body{
  82. background: url("");
  83. }
  84. </script>
  85.  
  86. <script id="jsbin-source-javascript" type="text/javascript">function u(){
  87. var N1 = document.getElementById("inpt1").value;
  88. var N2 = document.getElementById("inpt2").value;
  89. document.querySelector(".target1").innerHTML = (N1);
  90. document.querySelector(".target2").innerHTML = (N2);
  91. console.log("N1");
  92. window.sessionStorage.setItem("first", N1);
  93. window.localStorage.last = N2;
  94. }
  95. document.getElementById("resultFirst").innerHTML = window.sessionStorage.getItem('first');
  96. document.getElementById("resultLast").innerHTML = window.localStorage.last;
  97. </script></body>
  98. </html>
Add Comment
Please, Sign In to add comment