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

Storan tempatan Nota

Linda Hamilton
Linda Hamiltonasal
2025-01-17 02:08:09865semak imbas

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:

`; } };

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!

Kenyataan:
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 sebelumnya:Mencipta Komponen Kad Pratonton NFT InteraktifArtikel seterusnya:tiada

Artikel berkaitan

Lihat lagi