javascript - 如何在使用 JavaScript 的 vue-cli 编译的代码中获取类的 CSS?
问题描述
我需要获取与 HTML 中每一类代码相对应的 CSS 代码。HTML 代码如下:
<div data-v-52a38b90="" class="flex-column align-center pa-0 col">
<div data-v-52a38b90="" class="row flex-row-reverse align-center ma-0">
<button data-v-52a38b90="" type="button" class="ml-auto mr-6 my-4 v-btn v-btn--icon v-btn--round theme--light v-size--default red--text">
<span class="v-btn__content"><i data-v-52a38b90="" aria-hidden="true" class="v-icon notranslate mdi mdi-close theme--light"></i></span>
</button>
<div data-v-52a38b90="" class="v-card__title ml-7">Titulo</div>
</div>
<div data-v-52a38b90="" class="row d-flex align-center ma-0">
<div data-v-52a38b90="" class="mx-auto my-0 v-card v-sheet theme--light" style="height: 610px; width: 450px; background-color: rgb(221, 221, 221); border-color: rgb(221, 221, 221);">
<div data-v-52a38b90="" class="v-card__text">
<div data-v-52a38b90="" id="virtual_scroll"><div data-v-52a38b90="" class="d-flex flex-column"></div></div>
</div>
</div>
</div>
<div data-v-52a38b90="" class="row d-flex mx-auto my-0" style="width: 450px;">
<div data-v-52a38b90="" class="v-input ma-0 v-input--hide-details theme--light v-text-field v-text-field--single-line v-text-field--solo v-text-field--is-booted v-text-field--enclosed">
<div class="v-input__control">
<div class="v-input__slot">
<div class="v-text-field__slot"><input id="input-43" type="text" /></div>
<div class="v-input__append-inner">
<button data-v-52a38b90="" type="button" class="v-btn v-btn--icon v-btn--round theme--light v-size--default">
<span class="v-btn__content"><i data-v-52a38b90="" aria-hidden="true" class="v-icon notranslate mdi mdi-send theme--light"></i></span>
</button>
</div>
</div>
</div>
</div>
</div>
</div>
我需要使用 JavaScript 获取每个类的 CSS 属性(最好没有 Jquery)。
例如,我需要使用 JavaScript 获取 flex-column、align-center、pa-0 和 col 的 CSS 属性。
我已经使用了window.getComputedStyle(),但是我不想获取所有的CSS属性,我只需要每个类对应的那些,然后创建一个CSS文件根据它们的类对属性进行分类。
作为附加信息,HTML 代码是由 vue-cli 和 Material Design Vuetify 库生成的。
解决方案
推荐阅读
- javascript - 在 iframe 中嵌入 django 登录
- spring-boot - 如何配置 SpringBoot ObjectMapper
- c++ - CMake Vscode无法调试构建工作正常但调试有问题
- python - 如何确定回调中的python范围
- android - 是否可以在android中添加虚拟相机?
- javascript - 调用函数 (javascript)
- azure-api-management - 使用自定义域名访问内部 VNET 的 API 管理(获取默认 IIS 页面)
- delphi - 在 Delphi 10.4 中安装和使用 DCPCrypt2
- python - 如何在每一页(所有结果)上附加数据?
- python - 为什么我不能在第二次运行中运行代码?