项目中需要把div 上的样式值转成数据展示

形如: padding: 7px 2px 1px 3px; color: rgb(238, 65, 65); background-color: rgb(247, 106, 106); text-align: right;

转成:{ padding: '5px', text-align: 'right' }


// 样式转对象
function styleToObj(style) {
if (!style || style == '') { return }
var Arr = style.split(';')
Arr = Arr.filter(item => {
return item != ''
})
let str = ''
Arr.forEach(item => {
let test = ''
trim(item).split(':').forEach(item2 => {
test += '"' + trim(item2) + '":'
})
str += test + ','
})
str = str.replace(/:,/g, ',')
str = str.substring(0, str.lastIndexOf(','))
str = '{' + str + '}'
return JSON.parse(str)
}

/**
* 去掉字符串前后所有空格
*/

function trim (str, isglobal) {
var result
result = str.replace(/(^\s+)|(\s+$)/g, '')
if (isglobal && isglobal.toLowerCase() === 'g') {
result = result.replace(/\s/g, '')
}
return result
}

 

JS 样式字符串 转 JSON对象的更多相关文章

  1. js中字符串转json对象时报错: Uncaught SyntaxError: Unexpected token s in JSON at position 2

    解决方法: js中获取jsp的返回值 var json='${channels}' var channels = JSON.parse(json);就报上面的错. json的值最终会转成这种json格 ...

  2. js 将json字符串转换为json对象的方法解析

    推荐: var obj = eval('(' + str + ')'); var last=JSON.stringify(obj); //将JSON对象转化为string字符 例如: JSON字符串: ...

  3. js中json字符串与json对象的相互转换

    web前端开发过程中,数据传输json是以字符串的形式传递,而js操作的是JSON对象. 一.JSON字符串转换为JSON对象 var obj = JSON.parse(str[, reviver]) ...

  4. js 将json字符串转换为json对象的方法解析-转

    例如: JSON字符串:var str1 = '{ "name": "cxh", "sex": "man" }'; JS ...

  5. js 将json字符串转换为json对象

    要引入:jquery-json-2.4.js 在数据传输过程中,json是以文本,即字符串的形式传递的,而JS操作的是JSON对象,所以,JSON对象和JSON字符串之间的相互转换是关键.例如: JS ...

  6. js json字符串与json对象互相转换(最全)

      1.json字符串转json对象 使用场景:通常在取json字符串里具体的值时,会用到. var jsonString = '{"name":"Marydon&quo ...

  7. JS/Jquery遍历JSON对象、JSON数组、JSON数组字符串、JSON对象字符串

    JS遍历JSON对象 JS遍历JSON对象 <script> var obj = { "goodsid": "01001", "goods ...

  8. js 中json字符串转化json对象

    JSON字符串:var str = '{ "name": "cxh", "sex": "man" }'; JSON对象: ...

  9. js篇-json字符串与json对象相互转化

    回调返回结果是 json字符串还是json对象一定要看清楚哦,状态不好的时候,感觉眼神也不好使了, var a = "{"name":"jenny", ...

随机推荐

  1. docker-网络基础

    网络 Docker 网络从覆盖范围可分为单个 host 上的容器网络和跨多个 host 的网络 Docker 安装时会自动在 host 上创建三个网络, ⚡ root@bogon  /home  ...

  2. css基本语法及页面引用

    css基本语法 css的定义方法是: 选择器 { 属性:值; 属性:值; 属性:值;} 选择器是将样式和页面元素关联起来的名称,属性是希望设置的样式属性每个属性有一个或多个值.代码示例: div{ w ...

  3. [NOI2010]海拔(最小割)

    题目描述 YT市是一个规划良好的城市,城市被东西向和南北向的主干道划分为n×n个区域.简单起见,可以将YT市看作一个 正方形,每一个区域也可看作一个正方形.从而,YT城市中包括(n+1)×(n+1)个 ...

  4. [SCOI2005]王室联邦(构造)

    “余”人国的国王想重新编制他的国家.他想把他的国家划分成若干个省,每个省都由他们王室联邦的一个成员来管理. 他的国家有n个城市,编号为1..n.一些城市之间有道路相连,任意两个不同的城市之间有且仅有一 ...

  5. poj 2356 (抽屉原理)

    题目链接:http://poj.org/problem?id=2356 题目大意:给你n个数,要你从n个数选出若干个数,要求这若干个数的和是n的倍数,输出选择数的个数,以及相应的数. 解题思路: 以下 ...

  6. QML学习笔记(一)-防止鼠标穿透事件

    作者: 狐狸家的鱼 Github: 八至 1.防止鼠标穿透 MouseArea{ anchors.fill: parent; onClicked: {}; onReleased: {}; onPres ...

  7. Django 获取访问者信息

    request内的META里有请求用户的信息 #定义视图方法 def get_ip(request): #打印头部所以信息 # print(request.META) # 获取ip信息 if &quo ...

  8. PostCSS理解与运用

    1.PostCSS是什么 它可以被理解为一个平台,可以让一些插件在上面跑 它提供了一个解析器,可以将CSS解析成抽象语法树 通过PostCSS这个平台,我们能够开发一些插件,来处理CSS.热门插件如a ...

  9. 计算机基础:计算机网络-chapter3

    数据链路层,给两个相邻节点传输数据. 数据链路:物理链路+通信协议. 数据链路层使用的信道主要有点对点信道和广播信道两种. 一.点对点信道的PPP协议: 用三层模型来研究数据链路层,不管在哪一链路上的 ...

  10. springboot 修改页面不重启

    shifr+alt+commond+/ <!-- 热部署模块 --><dependency> <groupId>org.springframework.boot&l ...