第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全，請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問(wèn)題，去搜搜看，總會(huì)有你想問(wèn)的

在 Javascript/Node.js 中將 CSS 文件轉(zhuǎn)換為字符串

在 Javascript/Node.js 中將 CSS 文件轉(zhuǎn)換為字符串

LEATH 2022-10-27 16:38:30
需要用 CSS 文件中的樣式制作一個(gè) head 腳本標(biāo)簽——如何解析styles/style.css成一個(gè)字符串來(lái)填充documentStyles變量？這發(fā)生在 Node.js 函數(shù)中。樣式.cssp {  text-align: center;}index.jsconst documentStyles = // SOMETHING TO STRINGIFY style.cssconst document = `  <!DOCTYPE html>  <html>    <head>      <meta charset="UTF-8">      <style>        ${documentStyles}      </style>    </head>    <body>      <p>Here's the test</p>    </body>  </html>`
查看完整描述

2 回答

?
慕運(yùn)維8079593

TA貢獻(xiàn)1876條經(jīng)驗(yàn) 獲得超5個(gè)贊

您只需使用 NodeJS 加載 CSS 文件的內(nèi)容fs.readFileSync。


const fs = require('fs');


try {  

  const documentStyles = fs.readFileSync('styles/style.css');

  const document = `

  <!DOCTYPE html>

  <html>

    <head>

      <meta charset="UTF-8">

      <style>

        ${documentStyles}

      </style>

    </head>

    <body>

      <p>Here's the test</p>

    </body>

  </html>

`;

} catch(e) {

    console.log('Error:', e.stack);

}


查看完整回答
反對(duì) 回復(fù) 2022-10-27
?
慕的地6264312

TA貢獻(xiàn)1817條經(jīng)驗(yàn) 獲得超6個(gè)贊

正如 Christos Lytras 所指出的，通過(guò)文件系統(tǒng) (fs) 模塊在節(jié)點(diǎn)中獲取文件的字符串內(nèi)容非常容易，但是如果您關(guān)心的是如何通過(guò) API 獲取 JavaScript 可以使用的對(duì)象，您可能需要 CSSStyleSheet應(yīng)用程序接口。

這個(gè)對(duì)象有一個(gè).cssRules屬性，它包含一個(gè)類似數(shù)組的 cssRule對(duì)象列表。您將遍歷這些并檢查它們的type屬性（因?yàn)椴煌囊?guī)則類型具有不同的內(nèi)部結(jié)構(gòu)）。

大多數(shù)將具有type: 1，這意味著它們是 cssStyleRule對(duì)象，它們具有：

  • 一個(gè)selector屬性（如.my-awesome-class），以及

  • 一個(gè)style屬性（如{ font-size: 1.5em; color: hotpink; }）。

一旦達(dá)到這個(gè)級(jí)別，您可能需要使用正則表達(dá)式解析選擇器和樣式，除非它們都非常簡(jiǎn)單。您將構(gòu)建一個(gè)自定義對(duì)象以分配給您的documentStyles變量。

除此之外，您還需要將 CSS 的kebab-case名稱轉(zhuǎn)換為 JavaScript 的camelCase格式（或者您可能會(huì)在網(wǎng)上找到可以為您完成此操作的代碼。）

（這個(gè)問(wèn)題的答案為您提供了一個(gè)深入研究樣式表以查找特定規(guī)則并檢查其樣式屬性的示例。）


查看完整回答
反對(duì) 回復(fù) 2022-10-27
  • 2 回答
  • 0 關(guān)注
  • 623 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購(gòu)課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

 幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

 公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)