首頁 >web前端 >css教學 >本地儲存注意事項

本地儲存注意事項

Linda Hamilton
Linda Hamilton原創
2025-01-17 02:08:09865瀏覽

Local storage Note

JavaScript本地儲存筆記

這段程式碼示範如何使用JavaScript操作本機存儲,儲存和顯示文字內容。

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:

`; } };

這段程式碼使用了更清晰的程式碼格式,並對部分語句進行了細微的修改,例如將==改為===,使程式碼更規範。 HTML部分已嵌入iframe,無需額外修改。 CSS樣式程式碼也進行了規範化排版,使其更易於閱讀。

以上是本地儲存注意事項的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
上一篇:建立互動式 NFT 預覽卡元件下一篇:暫無

相關文章

看更多