JQ_使用模板配合Json动态添加css样式

最新推荐文章于 2020-09-27 12:40:04 发布

萧萧可乐

最新推荐文章于 2020-09-27 12:40:04 发布

阅读量3.1k

点赞数

分类专栏： JQuery 文章标签： json css function list border header

本文链接：https://blog.csdn.net/NIHAOX1/article/details/7716869

版权

本文介绍了一种避免在JS中混合CSS样式的做法，通过创建一个JQ插件，利用HTML模板和Json数据来动态添加CSS样式。这种方法使代码更易于理解和维护。文中提供了一个基础框架，并指出实际应用可能需要根据项目需求进行调整。

摘要由CSDN通过智能技术生成

最近换了家公司

发现新公司里的同事在做后台AJAX配合Json、时，经常将需要动态生成的css样式写在JS中，让代码的解读变得异常困难

于是和组长谈论了下写了个小JQ插件

在HTML页面中写入模板后台JS动态根据模板内容嵌套数据即可：

代码如下：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<style>
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,

最低0.47元/天解锁文章

萧萧可乐

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JQ_使用模板配合Json动态添加css样式

最近换了家公司发现新公司里的同事在做后台AJAX配合Json、时，经常将需要动态生成的css样式写在JS中，让代码的解读变得异常困难于是和组长谈论了下写了个小JQ插件在HTML页面中写入模板后台JS动态根据模板内容嵌套数据即可：代码如下：Untitled Documenthtml,body,div,span,applet,object,ifr
复制链接

扫一扫

专栏目录