Rumah > hujung hadapan web > tutorial css > Storan tempatan Nota

Storan tempatan Nota

Linda Hamilton
Lepaskan: 2025-01-17 02:08:09
asal
872 orang telah melayarinya

Local storage Note

Nota storan setempat JavaScript

Kod ini menunjukkan cara menggunakan JavaScript untuk mengendalikan storan setempat, menyimpan dan memaparkan kandungan teks.

Kod JavaScript:

<code class="language-javascript">let title = document.getElementById('title');
let text = document.getElementById('body');
let saveBtn = document.getElementById('save');
let display = document.getElementById('display');
let pst = document.getElementById('pst');
let clr = document.getElementById('clr');

saveBtn.onclick = function() {
  if (text.value === '') {
    alert('正文内容不能为空!');
  } else {
    pst.innerHTML += `
      <div>
        <p>CSS:</p>
        <pre class="brush:php;toolbar:false">
          #display {
            border: 4px solid;
          }
          #saver {
            border: 2px solid;
          }
          #clr {
            margin: 5%;
          }
          #editor {
            box-shadow: 0 0 3px red;
          }
          #editor input {
            width: 80%;
            box-shadow: 0 2px;
            color: #fff;
            -webkit-text-stroke: 1px #111;
          }
          #editor textarea {
            width: 80%;
            display: block;
            margin: 5% 2px 2px 9%;
            box-shadow: 0 0 3px;
            text-align: center;
          }
          #editor button, #display button {
            background: conic-gradient(navy, #44f);
            border-radius: 10px;
            border: 4px solid #0f07f0;
            width: 80%;
            font-size: 24px;
            color: white;
            -webkit-text-stroke: 2px red;
            font-weight: 800;
            text-transform: uppercase;
          }
        

HTML:

`; } };
Salin selepas log masuk

Kod ini menggunakan format kod yang lebih jelas, dan beberapa pernyataan diubah suai sedikit, seperti menukar == kepada === untuk menjadikan kod lebih piawai. Bahagian HTML telah dibenamkan dalam iframe dan tiada pengubahsuaian tambahan diperlukan. Kod gaya CSS juga telah diseragamkan dan ditaip untuk memudahkan pembacaan.

Atas ialah kandungan terperinci Storan tempatan Nota. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Cadangan popular
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan