Javascript 如何在jQuery中编辑数据属性值？

我正在努力

将所示数据中的黄色替换为红色

然后…将单词margin20添加到显示的数据中

然后…将单词padding20添加到显示的数据中

然后…从显示的数据中删除“工具”一词

$（函数（）{
var data=$（“.testclass”）.attr（'data-show'）；
数据=数据。替换（“黄色”、“红色”）；
$（“.testclass”）.attr（'数据显示'，数据）；
警报（$（“.testclass”）.attr（'data-show'）；
});
//警报应为-w h红色边缘80填充20

[显示的数据~=“w”]{宽度：100px；}
[显示的数据~=“h”]{高度：100px；}
[显示的数据~=“黄色”]{背景：黄色；}
[显示的数据~=“红色”]{背景：红色；}
[显示的数据~=“margin80”]{margin:80px；}
[显示的数据~=“padding20”]{padding:20px；}

测试

希望你所需要的

$（函数（）{
var data=$（“.testclass”）.attr（'data-show'）；
数据=数据。替换（“黄色”、“红色”）；
$（“.testclass”）.attr（'数据显示'，数据）；
警报（$（“.testclass”）.attr（'data-show'）；
});
[显示的数据~=“w”]{宽度：100px；}
[显示的数据~=“h”]{高度：100px；}
[显示的数据~=“黄色”]{背景：黄色；}
[显示的数据~=“红色”]{背景：红色；}

测试
我认为这更容易理解：


$（函数（）{
$（'.testclass'）.addClass（'red'））
警报（$（'.testclass'）.attr（'class'））/“testclass w h黄红色”
$（'.testclass'）.removeClass（'yellow'））
警报（$（'.testclass'）.attr（'class'））/“testclass w h红色”
})
.w{
宽度：100px；
}
h{
高度：100px；
}
瑞德先生{
背景色：红色；
}
黄先生{
背景颜色：黄色；
}

测试
是否还有一种方法可以添加一个带空格的单词…比如将单词…紫色添加到现有数据…带空格？是的…我理解addClass…但它需要是一个数据属性