从事PHP开拓很多年了，也写过些小项目，常常要在后台天生前端输出的HTML脚本，说白了便是把HTML措辞以字符串的办法嵌入在PHP的输入语句中，纯挚的输出没什么问题，但碰着DOM修正时很是麻烦，要做各种查找与更换，还要写一大堆正则，反反复复，效率极低。也用过网上的一些PHP操作DOM的开源项目，不过问题多多，要么就停更良久了，要么不完善，我在写代码这个问题上是个不姑息的人，以是，就自己想整一个这么个项目，我的目的很大略，便是要在PHP里操作DOM就像Jquery一样，能天生，能解析，还要能符合目前H5及CSS3的特性。我准备花点韶光来记录这一过程，该当要分几个章节来写，我的环境是LAMP，PHP基于PHP7.3版本。先来说一下书写规则。对了，这是我在简书上写的第一篇文章，以是态度上我是很负责的。我给这个项目取名叫SPEEDX,很多命名前缀我会带上这个项目名，为什么呢，由于PHP中我特殊不喜好命名空间这么个玩意，不知为什么，性情如此。
每每想象很美好的事情，现实确很骨感。为了达到对DOM及CSS精准操作的目的，不搞大杂会，为此我仔细剖析了一下，本项目操作紧张对像该当这样分类：
1. CSS类：`.className{属性列表}`
2. CSS属性 : `vName: value`
3. DOM标签 诸如`<div></div>`等
4. DOM属性,如： `<div class=\"大众cssName\"大众 id=\"大众idName\公众></div>`
5. DOM节点基本内容: 便是节点内的内容，也可以人包含其它节点
为此，我弄了个比较详细的config文件，个中定义的HTML及CSS中所用的标签、属性及干系浏览器的支持情形。个中主要的几项常量定义我做一下解释：
SPEEDX_STYLE_NULL = 0;//CSS3标准，但还没有浏览器实现SPEEDX_STYLE_W3C = 1; //W3C标准属性：表示支持这一属性或支持这一属性值的浏览器都是采取标准格式，即不带浏览器前缀的书写办法；SPEEDX_STYLE_MOZ = 2; //火狐浏览器内核(-moz-):表示支持这一属性或属性值的火狐浏览器在书写格式上要带\"大众-moz-\"大众前缀;SPEEDX_STYLE_WEBKIT = 4; //Chrome和Safari浏览器内核:表示支持这一属性或属性值的浏览器在CSS书写格式上要带\公众-webkit-\"大众前缀;SPEEDX_STYLE_MS = 8; //IE浏览器内核:IE支持的CSS特性，要加\"大众-ms-\公众前缀SPEEDX_STYLE_O = 16; //Opera浏览器内核：对付兼容部分Opera浏览器，CSS特性前要加\"大众-o-\公众前缀SPEEDX_STYLE_ALL = 31; //所有兼容模式，为了兼容大部分主流浏览器的不同版本，要加上上面所有的前缀。详细配置如下：文件中已备表明释：
<?php / speedx版本及版本号 / const SPEEDX_VARNAME = \公众0.1.1\"大众; const SPEEDX_VARCODE = 1; const SPEEDX_ARCHI_BOOTSTRAP = \"大众SPEEDX_ARCHI_BOOTSTRAP\公众; const SPEEDX_ARCHI_SEMANTIC = \"大众SPEEDX_ARCHI_SEMANTICUI\公众; const COMPACT_TO_STRING = 0;//用于函数speedxCompactJs(),此常量表示压缩后的js以字符串的办法返回； const COMPACT_TO_FILE = 1;//:用于函数speedxCompactJs(),此常量表示压缩后的js存储到指定的js文件； const SPEEDX_REQUEST_GET = \"大众SPEEDX_REQUEST_GET\公众; const SPEEDX_REQUEST_POST = \"大众SPEEDX_REQUEST_POST\"大众; / 格式化输出时每一行结尾要附加的字符 / const SPEEDX_RN = \"大众\r\n\"大众; const SPEEDX_BR = \"大众<br/>\公众; const SPEEDX_NIL = \"大众\"大众; $SPEEDX_FORMAT_LINE_END = SPEEDX_NIL; / 格式化输出时新行前导字符 / const SPEEDX_FORMAT_FIX_HTML = \"大众 \公众; const SPEEDX_FORMAT_FIX_SPACE = \"大众 \公众; $SPEEDX_FORMAT_LINE_HEAD = SPEEDX_NIL; / 非常处理类所用到的常定义： 调用主文件：_SPEEDX_CLASS_PHP_/class.speedx_error_debuger.php / const SPEEDX_STDOUT_NULL = 0; //信息屏蔽 const SPEEDX_STDOUT_SCREEN = 1;//信息输出至屏幕 const SPEEDX_STDOUT_FILE = 2;//信息输出至文件 const SPEEDX_STDOUT_WEBSOCKET = 3;//信息输出至后台管理员 const SPEEDX_STDOUT_DB = 4;//信息输出至数据库 const SPEEDX_DUBUG_DATATABLE = \"大众exception\"大众; //非常记录数据库表名称，表构造为固定构造，详见表定义 $_SPEEDX_DEBUGLOG = _SPEEDX_LOG_ . \"大众speedx_debug.log\公众; $_DEBUG_TYPE = SPEEDX_STDOUT_FILE; //自定义非常输入办法，生产时请设置为：DEBUG_TO_LOG $_SPEEDX_ERRLOG = _SPEEDX_LOG_ . \"大众speedx_error.log\"大众; //自定义非常日志文件 $_ERR_TYPE = SPEEDX_STDOUT_FILE; //自定义非常输入办法，生产时请设置为：ERR_TO_LOG / speedx_domnodes类在解析时节点的状态 / const SPEEDX_DOMNODE_TAG_START = 1;//解析节点须要起始标签 const SPEEDX_DOMNODE_TAG_END = 2;//解析节点须要结束标签 const SPEEDX_DOMNODE_CLOSE = 3;//解析节点禁止节点操作 / 自定义输入的缺点级别 自定输出的信息不受全局环境设置影响，始终会输出到终端 / const SPEEDX_ERR_LEVEL_NORMAL = 0; //常规信息 const SPEEDX_ERR_LEVEL_SUCCESS = 1; //突出信息 const SPEEDX_ERR_LEVEL_WARNING = 2; //警告信息 const SPEEDX_ERR_LEVEL_DANGER = 3; //危险信息 const SPEEDX_ERR_LEVEL_ERROR = 4; //缺点信息 const SPEEDX_RETURN_OK = 1; //全局缺点返回类中缺点信息: 精确 const SPEEDX_RETURN_ERR = 0; //全局缺点返回类中缺点信息: 缺点 const SPEEDX_RETURN_NODEFINE = -1;//全局缺点返回类中缺点信息: 未定义 / speedx节点常量： 调用主文件：_SPEEDX_CLASS_PHP_/class.speedx.php -> class speedx_node{} / const SPEEDX_NODE_DOCTYPE = \公众_doctype_\"大众; //doctype类型 const SPEEDX_NODE_STANDARD = \公众_standard_\公众; //标准对称标签 const SPEEDX_NODE_SINGLE = \"大众_single_\"大众; //单标签内容 const SPEEDX_NODE_META = \公众_meta_\"大众; //meta标签 const SPEEDX_NODE_COMMENT = \"大众_comment_\公众; //备注标签 const SPEEDX_NODE_TEXT = \公众_text_\公众; //文本内容 const SPEEDX_NODE_VAR = \"大众_var_\公众; //变量标签，用于PHP内容更换 const SPEEDX_NODE_NULL = \"大众_null_\"大众; //空内容标签 const SPEEDX_NODE_STYLE = \公众_style_\公众; //style标签 const SPEEDX_NODE_SCRIPT = \公众_script_\"大众; //脚本标签 const SPEEDX_NODE_PHP = \"大众_php_\公众; //保留的:php脚本标签，用于后期扩展 const SPEEDXNODE_DOCTYPE = 1; const SPEEDXNODE_STANDARD = 2; const SPEEDXNODE_SINGLE = 4; const SPEEDXNODE_META = 8; const SPEEDXNODE_COMMENT = 16; const SPEEDXNODE_TEXT = 32; const SPEEDXNODE_VAR = 64; const SPEEDXNODE_STYLE = 128; const SPEEDXNODE_SCRIPT = 256; const SPEEDXNODE_PHP = 512; const SPEEDXNODE_NULL = 1024; / doctype类型声明： / const DOCTYPE_HTML5 = '<!DOCTYPE HTML>'; const DOCTYPE_HTML_4_01_STRICT = '<!DOCTYPE HTML PUBLIC \公众-//W3C//DTD HTML 4.01//EN\"大众 \公众http://www.w3.org/TR/html4/strict.dtd\"大众>'; const DOCTYPE_HTML_4_01_TRANSITIONAL = '<!DOCTYPE HTML PUBLIC \"大众-//W3C//DTD HTML 4.01 Transitional//EN\"大众 \"大众http://www.w3.org/TR/html4/loose.dtd\公众>'; const DOCTYPE_HTML_4_01_FRAMESET = '<!DOCTYPE HTML PUBLIC \公众-//W3C//DTD HTML 4.01 Frameset//EN\公众 \"大众http://www.w3.org/TR/html4/frameset.dtd\公众>'; const DOCTYPE_XHTML_1_0_STRICT = '<!DOCTYPE HTML PUBLIC \公众-//W3C//DTD XHTML 1.0 Strict//EN\"大众 \"大众http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd\"大众>'; const DOCTYPE_XHTML_1_0_TRANSITIONAL = '<!DOCTYPE HTML PUBLIC \"大众-//W3C//DTD XHTML 1.0 Transitional//EN\"大众 \"大众http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\"大众>'; const DOCTYPE_XHTML_1_0_FRAMESET = '<!DOCTYPE HTML PUBLIC \公众-//W3C//DTD XHTML 1.0 Frameset//EN\"大众 \"大众http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd\公众>'; const DOCTYPE_XHTML_1_1 = '<!DOCTYPE HTML PUBLIC \公众-//W3C//DTD XHTML 1.1//EN\公众 \"大众http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd\"大众>'; / HTML标签列表 / $SPEEDX_NODE_TYPE = []; $SPEEDX_NODE_TYPE[SPEEDX_NODE_DOCTYPE] = [\"大众doctype\"大众,\公众!doctype\公众]; $SPEEDX_NODE_TYPE[SPEEDX_NODE_SINGLE] = [\"大众br\"大众,\公众hr\"大众]; $SPEEDX_NODE_TYPE[SPEEDX_NODE_META] = [\公众meta\"大众,\公众base\"大众,\"大众embed\公众,\"大众link\公众,\"大众track\"大众,\公众input\"大众,\"大众img\"大众,\公众keygen\"大众]; $SPEEDX_NODE_TYPE[SPEEDX_NODE_COMMENT] = [\公众!--\"大众,\"大众comment\"大众]; $SPEEDX_NODE_TYPE[SPEEDX_NODE_TEXT] = [\"大众text\"大众]; $SPEEDX_NODE_TYPE[SPEEDX_NODE_VAR] = [\"大众_var_\"大众,'$_var_']; $SPEEDX_NODE_TYPE[SPEEDX_NODE_STYLE] = [\"大众style\"大众]; $SPEEDX_NODE_TYPE[SPEEDX_NODE_SCRIPT] = [\"大众script\"大众]; $SPEEDX_NODE_TYPE[SPEEDX_NODE_NULL] = [null,\"大众\公众]; $SPEEDX_NODE_TYPE[SPEEDX_NODE_STANDARD] = [ \"大众a\"大众,\"大众abbr\"大众,\公众acronym\"大众,\"大众address\"大众,\"大众applet\"大众,\公众area\公众,\公众article\公众,\"大众aside\"大众,\"大众audio\公众, \"大众b\"大众,\公众basefont\公众,\公众bdi\"大众,\"大众bdo\"大众,\"大众big\"大众,\公众blockquote\"大众,\"大众body\公众,\公众button\公众,\公众canvas\"大众,\"大众caption\公众, \"大众center\"大众,\"大众cite\"大众,\公众code\公众,\公众col\"大众,\公众colgroup\公众,\"大众command\"大众,\"大众datalist\"大众,\"大众dd\"大众,\"大众del\"大众,\"大众details\"大众, \"大众dfn\"大众,\"大众dialog\"大众,\公众dir\"大众,\"大众div\公众,\公众dl\"大众,\"大众dt\公众,\公众em\公众,\"大众fieldset\"大众,\"大众figcaption\公众,\"大众figure\"大众,\"大众font\"大众, \"大众footer\"大众,\公众form\"大众,\公众frame\"大众,\公众frameset\公众,\公众h1\"大众,\"大众h2\"大众,\"大众h3\"大众,\公众h4\"大众,\"大众h5\公众,\公众h6\"大众,\公众head\公众,\"大众header\公众, \"大众html\公众,\公众i\"大众,\公众iframe\"大众,\"大众ins\公众,\公众kbd\"大众,\"大众label\公众,\"大众legend\"大众,\公众li\公众,\"大众map\公众,\"大众mark\"大众,\公众menu\"大众,\"大众nav\"大众, \公众noframes\"大众,\"大众noscript\"大众,\"大众object\"大众,\"大众ol\公众,\"大众optgroup\"大众,\公众option\"大众,\"大众output\"大众,\"大众p\"大众,\"大众param\公众,\公众pre\公众, \"大众progress\公众,\公众q\公众,\公众rp\"大众,\"大众rt\公众,\"大众ruby\公众,\"大众s\公众,\"大众samp\"大众,\"大众section\公众,\"大众select\公众,\公众small\"大众,\公众source\公众, \"大众span\公众,\公众strike\公众,\"大众strong\"大众,\"大众sub\"大众,\公众summary\公众,\"大众sup\"大众,\"大众table\"大众,\"大众tbody\"大众,\"大众td\公众,\公众textarea\公众,\公众tfoot\"大众, \"大众th\公众,\公众thead\公众,\"大众time\公众,\公众title\"大众,\"大众tr\"大众,\"大众tt\"大众,\公众u\"大众,\"大众ul\"大众,\"大众var\"大众,\"大众video\"大众,\公众wbr\"大众,\"大众def\"大众 ]; $SPEEDX_NODE_TYPE[SPEEDX_NODE_PHP] = [\"大众php\"大众]; / HTML标签属性列表 / $SPEEDX_DOM_NODE = []; / 升降序声明,用于创建自动升序或自动降序序列的字符内容。 调用主文件：_SPEEDX_CLASS_PHP_/function.speedx.php -> function padSetString()定义 / const SPEEDX_ASCENDING = 0; const SPEEDX_DESCENDING = 1; / session存储办法 / const SESSION_MYSQL = 0; const SESSION_REDIS = 1; const SESSION_FILE = 2; const SESSION_MEMCACHED = 3; / node节点中添加属性时，以什么办法处理已经存在的同名属性： SPEEDX_OPERATOR_MODE_REPLACE : 直接更换 SPEEDX_OPERATOR_MODE_ATTACH : 属性值追加(对付拥有多个属性值而言) SPEEDX_OPERATOR_MODE_REMOVE : 删除已知属性中的某个值 / const SPEEDX_OPERATOR_MODE_REPLACE = 1; const SPEEDX_OPERATOR_MODE_ATTACH = 2; const SPEEDX_OPERATOR_MODE_REMOVE = 3; / printdom()函数的打印模式 / const PRINT_CUR_NODE = 1; const PRINT_BEFOR_NODES = 2; const PRINT_AFTER_NODES = 4; const PRINT_ALL_NODES = 7; / CSS属性前缀类型，用于匹配不同内核的浏览器 紧张匹配以下浏览器：Firefox(FF),IE,Opera,Chrome,Safari; / const SPEEDX_STYLE_DEFAULT = -1;//全局默认值,由配置参数$SPEEDX_STYLE_SHOW确定 const SPEEDX_STYLE_NULL = 0;//CSS3标准，但还没有浏览器实现 const SPEEDX_STYLE_W3C = 1; //W3C标准属性：表示支持这一属性或支持这一属性值的浏览器都是采取标准格式，即不带浏览器前缀的书写办法； const SPEEDX_STYLE_MOZ = 2; //火狐浏览器内核(-moz-):表示支持这一属性或属性值的火狐浏览器在书写格式上要带\"大众-moz-\"大众前缀; const SPEEDX_STYLE_WEBKIT = 4; //Chrome和Safari浏览器内核:表示支持这一属性或属性值的浏览器在CSS书写格式上要带\公众-webkit-\"大众前缀; const SPEEDX_STYLE_MS = 8; //IE浏览器内核:IE支持的CSS特性，要加\"大众-ms-\公众前缀 const SPEEDX_STYLE_O = 16; //Opera浏览器内核：对付兼容部分Opera浏览器，CSS特性前要加\"大众-o-\公众前缀 const SPEEDX_STYLE_ALL = 31; //所有兼容模式，为了兼容大部分主流浏览器的不同版本，要加上上面所有的前缀。 $SPEEDX_STYLE_SHOW = SPEEDX_STYLE_ALL; //天生的样式表中包含哪些内核样式,此属性为用户自定义参数。可在config.userDefine.php中定义。 / CSS各前导类所被浏览器支持的列表 / $SPEEDX_CLASS_STYLE = [ \公众@import\"大众 => SPEEDX_STYLE_W3C, \"大众@charset\"大众 => SPEEDX_STYLE_W3C, \公众@media\"大众 => SPEEDX_STYLE_W3C, \"大众@font-face\公众 => SPEEDX_STYLE_W3C, \公众@page\公众 => SPEEDX_STYLE_W3C, \公众@keyframes\"大众 => SPEEDX_STYLE_MOZ + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_W3C, \"大众@supports\公众 => SPEEDX_STYLE_W3C ]; / CSS_CLASS类型定义 / const SPEEDX_CLASS_IMPORT = 1; const SPEEDX_CLASS_CHARSET = 2; const SPEEDX_CLASS_MEDIA = 3; const SPEEDX_CLASS_FONTFACE = 4; const SPEEDX_CLASS_PAGE = 5; const SPEEDX_CLASS_KEYFRAMES = 6; const SPEEDX_CLASS_SUPPORTS = 7; const SPEEDX_CLASS_STANDARD = 8; const SPEEDX_CLASS_ANONYMOUS = 9; / CSS固定属性值列表： $SPEEDX_STYLE_VALUE是全局定义的CSS属性值列表（数组），有些CSS属性的值是固定的， 有些CSS属性值除了固定值值以外也扶持自定义的值。在$SPEEDX_STYLE_VALUE中定义如下： $SPEEDX_STYLE_VALUE[CSS属性][\公众BASIC-SUPPORT\公众]:基本支持的属性值，这些值目前为止所有浏览器都支持，用\公众w3c\"大众表示； $SPEEDX_STYLE_VALUE[CSS属性][\"大众USER-DEFINE\公众]：自定义属性，这类属性用标准格式\公众w3c\"大众表示; $SPEEDX_STYLE_VALUE[CSS属性][其它固定值]：不同的浏览器支持情形不同，分别用\"大众w3c\"大众,\公众webkit\"大众,\公众moz\公众,\"大众ms\公众,\公众o\"大众表示； / $SPEEDX_STYLE_VALUE = []; $SPEEDX_STYLE_VALUE[\公众position\公众] = [ \"大众BASIC-SUPPORT\"大众 => [\"大众static\公众,\"大众relative\公众,\"大众absolute\"大众,\"大众fixed\"大众], \公众center\"大众 => SPEEDX_STYLE_NULL, \"大众page\公众 => SPEEDX_STYLE_NULL, \公众sticky\"大众 => SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT ]; $SPEEDX_STYLE_VALUE[\公众display\公众] = [ \"大众BASIC-SUPPORT\公众 => [\"大众none\公众,\公众inline\"大众,\公众block\"大众,\公众list-item\"大众,\"大众table\"大众, \公众inline-table\"大众,\"大众table-caption\"大众,\"大众table-cell\"大众,\公众table-row\"大众, \"大众table-row-group\"大众,\"大众table-column\公众,\公众table-column-group\"大众, \"大众table-footer-group\"大众,\"大众table-header-group\"大众,\"大众run-in\"大众], \公众box\"大众 => SPEEDX_STYLE_MOZ + SPEEDX_STYLE_WEBKIT, \"大众inline-box\"大众 => SPEEDX_STYLE_MOZ + SPEEDX_STYLE_WEBKIT, \"大众flexbox\"大众 => SPEEDX_STYLE_MS, \"大众inline-flexbox\公众 => SPEEDX_STYLE_MS, \公众flex\"大众 => SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT, \"大众inline-flex\"大众 => SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT ]; $SPEEDX_STYLE_VALUE[\公众overflow\公众] = [ \公众BASIC-SUPPORT\"大众 => [\"大众visible\"大众,\"大众hidden\公众,\公众scroll\公众,\"大众auto\"大众], \"大众paged-x\"大众 => SPEEDX_STYLE_WEBKIT, \"大众paged-y\"大众 => SPEEDX_STYLE_WEBKIT, \公众paged-x-controls\公众 => SPEEDX_STYLE_NULL, \公众paged-y-controls\"大众 => SPEEDX_STYLE_NULL, \"大众fragments\公众 => SPEEDX_STYLE_NULL ]; $SPEEDX_STYLE_VALUE[\"大众overflow-x\"大众] = $SPEEDX_STYLE_VALUE[\公众overflow\公众]; $SPEEDX_STYLE_VALUE[\公众overflow-x\"大众][\"大众paged-x\公众] = SPEEDX_STYLE_NULL; $SPEEDX_STYLE_VALUE[\"大众overflow-x\"大众][\"大众paged-y\"大众] = SPEEDX_STYLE_NULL; $SPEEDX_STYLE_VALUE[\"大众overflow-y\"大众] = $SPEEDX_STYLE_VALUE[\"大众overflow-x\公众]; $SPEEDX_STYLE_VALUE[\"大众text-align\公众] = [ \公众BASIC-SUPPORT\公众 => [\"大众start\公众,\"大众end\"大众,\"大众left\"大众,\公众right\"大众,\"大众center\"大众,\公众justify\公众], \"大众match-parent\公众 => SPEEDX_STYLE_NULL, \公众justify-all\公众 => SPEEDX_STYLE_NULL ]; $SPEEDX_STYLE_VALUE[\公众text-align-last\"大众] = [ \公众BASIC-SUPPORT\"大众 => [\"大众auto\公众,\"大众left\公众,\"大众right\"大众,\公众center\"大众,\"大众justify\公众], \公众start\公众 => SPEEDX_STYLE_MOZ, \"大众end\公众 => SPEEDX_STYLE_MOZ, ]; $SPEEDX_STYLE_VALUE[\"大众cursor\"大众] = [ \"大众USER-DEFINE\"大众 => SPEEDX_STYLE_W3C, \"大众BASIC-SUPPORT\"大众 => [\公众auto\"大众,\"大众default\"大众,\"大众none\公众,\"大众context-menu\公众,\"大众help\"大众,\"大众pointer\"大众, \"大众progress\公众,\"大众wait\"大众,\公众cell\公众,\"大众crosshair\"大众,\公众text\"大众,\公众vertical-text\"大众,\"大众alias\"大众,\"大众copy\"大众, \公众move\"大众,\公众no-drop\"大众,\"大众not-allowed\"大众,\"大众e-resize\"大众,\公众n-resize\"大众,\"大众ne-resize\"大众,\"大众nw-resize\"大众, \"大众s-resize\公众,\"大众se-resize\公众,\公众sw-resize\"大众,\"大众w-resize\公众,\"大众ew-resize\"大众,\"大众ns-resize\"大众,\"大众nesw-resize\公众, \"大众nwse-resize\"大众,\"大众col-resize\"大众,\"大众row-resize\"大众,\公众all-scroll\"大众], \"大众zoom-in\"大众 => SPEEDX_STYLE_MOZ + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_W3C, \"大众zoom-out\"大众 => SPEEDX_STYLE_MOZ + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_W3C, \"大众grab\"大众 => SPEEDX_STYLE_MOZ + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_W3C, \"大众grabbing\"大众 => SPEEDX_STYLE_MOZ + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_W3C, ]; / CSS属性值的函数列表，不同的浏览器支持情形不同。 / $SPEEDX_STYLE_FUNCTION = [ \公众calc\公众 => SPEEDX_STYLE_MOZ + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_W3C, \"大众image-set\公众 => SPEEDX_STYLE_WEBKIT, \公众linear-gradient\"大众 => SPEEDX_STYLE_MOZ + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_W3C, \"大众radial-gradient\"大众 => SPEEDX_STYLE_MOZ + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_W3C, \"大众repeating-linear-gradient\公众 => SPEEDX_STYLE_MOZ + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_W3C, \"大众repeating-radial-gradient\"大众 => SPEEDX_STYLE_MOZ + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_W3C ]; / CSS属性列表 / $SPEEDX_STYLE_ATTR = []; $SPEEDX_STYLE_ATTR[\"大众align-content\公众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT; $SPEEDX_STYLE_ATTR[\公众align-items\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT; $SPEEDX_STYLE_ATTR[\公众align-self\公众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT; $SPEEDX_STYLE_ATTR[\"大众all\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众animation\公众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\公众animation-delay\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\公众animation-direction\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\"大众animation-duration\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ + SPEEDX_STYLE_O; $SPEEDX_STYLE_ATTR[\"大众animation-fill-mode\公众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\公众animation-iteration-count\公众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\"大众animation-name\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\公众animation-play-state\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\"大众animation-timing-function\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_MOZ + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_O; $SPEEDX_STYLE_ATTR[\"大众appearance\公众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\"大众aspect-ratio\公众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众backface-visibility\公众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ + SPEEDX_STYLE_MS; $SPEEDX_STYLE_ATTR[\公众background\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众background-attachment\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众background-blend-mode\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众background-clip\公众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\公众background-color\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\公众background-image\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众background-origin\公众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\公众background-position\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众background-repeat\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众background-size\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_MOZ + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_O; $SPEEDX_STYLE_ATTR[\公众border\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众border-bottom\公众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众border-bottom-color\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众border-bottom-left-radius\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\"大众border-bottom-right-radius\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\"大众border-bottom-style\公众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众border-bottom-width\公众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\公众border-collapse\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众border-color\公众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众border-image\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\"大众border-image-outset\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\"大众border-image-repeat\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\"大众border-image-slice\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\"大众border-image-source\公众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\"大众border-image-width\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\"大众border-left\公众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\公众border-left-color\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\公众border-left-style\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\公众border-left-width\公众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\公众border-radius\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\公众border-right\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众border-right-color\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众border-right-style\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众border-right-width\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众border-spacing\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众border-style\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众border-top\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众border-top-color\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众border-top-left-radius\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\公众border-top-right-radius\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\"大众border-top-style\公众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众border-top-width\公众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\公众border-width\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众bottom\公众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众box-align\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\"大众box-direction\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\"大众box-flex\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\公众box-flex-group\"大众] = SPEEDX_STYLE_WEBKIT; $SPEEDX_STYLE_ATTR[\"大众box-ordinal-group\公众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\"大众box-orient\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\"大众box-shadow\公众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\公众box-sizing\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\"大众caption-side\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众clear\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\公众clip\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众color\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\公众column-break-after\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT; $SPEEDX_STYLE_ATTR[\公众column-break-before\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT; $SPEEDX_STYLE_ATTR[\"大众column-break-inside\公众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT; $SPEEDX_STYLE_ATTR[\"大众column-count\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\"大众column-fill\公众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\"大众column-gap\公众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\"大众column-rule\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\"大众column-rule-color\公众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\公众column-rule-style\公众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\"大众column-rule-width\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\公众columns\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\公众column-span\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT; $SPEEDX_STYLE_ATTR[\"大众column-width\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\"大众content\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众counter-increment\公众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众counter-reset\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\公众cursor\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众device-aspect-ratio\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\公众device-height\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众device-width\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众direction\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众display\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ + SPEEDX_STYLE_MS; $SPEEDX_STYLE_ATTR[\"大众empty-cells\公众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\公众filter\公众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT; $SPEEDX_STYLE_ATTR[\"大众flex\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT; $SPEEDX_STYLE_ATTR[\公众flex-basis\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT; $SPEEDX_STYLE_ATTR[\"大众flex-direction\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT; $SPEEDX_STYLE_ATTR[\"大众flex-flow\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT; $SPEEDX_STYLE_ATTR[\"大众flex-grow\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT; $SPEEDX_STYLE_ATTR[\"大众flex-shrink\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT; $SPEEDX_STYLE_ATTR[\公众flex-wrap\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT; $SPEEDX_STYLE_ATTR[\公众float\公众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\公众font\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众font-family\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\公众font-sizes\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众font-size-adjust\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众font-stretch\公众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众font-style\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众font-variant\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众font-weight\公众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众height\公众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\公众justify-content\公众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\"大众left\公众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\"大众letter-spacing\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众line-height\公众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众list-style\公众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众list-style-image\公众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\公众list-style-position\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\公众list-style-type\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\公众margin\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\公众margin-bottom\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众margin-left\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众margin-right\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\公众margin-top\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众max-height\公众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众max-width\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众min-height\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众min-width\公众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\公众scrollbar-3dlight-color\公众] = SPEEDX_STYLE_W3C; //只有IE早期版本才有的属性（css1) $SPEEDX_STYLE_ATTR[\公众scrollbar-darkshadow-color\"大众] = SPEEDX_STYLE_W3C; //只有IE早期版本才有的属性（css1) $SPEEDX_STYLE_ATTR[\公众scrollbar-highlight-color\"大众] = SPEEDX_STYLE_W3C; //只有IE早期版本才有的属性（css1) $SPEEDX_STYLE_ATTR[\公众scrollbar-shadow-color\公众] = SPEEDX_STYLE_W3C; //只有IE早期版本才有的属性（css1) $SPEEDX_STYLE_ATTR[\"大众scrollbar-arrow-color\"大众] = SPEEDX_STYLE_W3C; //只有IE早期版本才有的属性（css1) $SPEEDX_STYLE_ATTR[\公众scrollbar-face-color\"大众] = SPEEDX_STYLE_W3C; //只有IE早期版本才有的属性（css1) $SPEEDX_STYLE_ATTR[\公众scrollbar-track-color\公众] = SPEEDX_STYLE_W3C; //只有IE早期版本才有的属性（css1) $SPEEDX_STYLE_ATTR[\"大众scrollbar-base-color\"大众] = SPEEDX_STYLE_W3C; //只有IE早期版本才有的属性（css1) $SPEEDX_STYLE_ATTR[\"大众filter\"大众] = SPEEDX_STYLE_W3C; //只有IE早期版本才有的属性（css1) $SPEEDX_STYLE_ATTR[\"大众behavior\"大众] = SPEEDX_STYLE_W3C; //只有IE早期版本才有的属性（css1) $SPEEDX_STYLE_ATTR[\"大众text-fill-color\"大众] = SPEEDX_STYLE_WEBKIT; //只有-webkit-才有的属性(css3); $SPEEDX_STYLE_ATTR[\公众text-stroke\公众] = SPEEDX_STYLE_WEBKIT; //只有-webkit-才有的属性(css3); $SPEEDX_STYLE_ATTR[\公众text-stroke-width\公众] = SPEEDX_STYLE_WEBKIT; //只有-webkit-才有的属性(css3); $SPEEDX_STYLE_ATTR[\公众text-stroke-color\"大众] = SPEEDX_STYLE_WEBKIT; //只有-webkit-才有的属性(css3); $SPEEDX_STYLE_ATTR[\"大众box-reflect\"大众] = SPEEDX_STYLE_WEBKIT; //只有-webkit-才有的属性(css3); $SPEEDX_STYLE_ATTR[\公众tap-highlight-color\"大众] = SPEEDX_STYLE_WEBKIT; //只有-webkit-才有的属性(css3); $SPEEDX_STYLE_ATTR[\"大众user-drag\公众] = SPEEDX_STYLE_WEBKIT; //只有-webkit-才有的属性(css3); $SPEEDX_STYLE_ATTR[\"大众overflow-scrolling\"大众] = SPEEDX_STYLE_WEBKIT; //只有-webkit-才有的属性(css3); $SPEEDX_STYLE_ATTR[\"大众opacity\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众order\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT; $SPEEDX_STYLE_ATTR[\公众outline\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众outline-color\公众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众outline-offset\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\公众outline-style\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众outline-width\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众overflow\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\公众overflow-wrap\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众overflow-x\公众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众overflow-y\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众padding\公众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\公众padding-bottom\公众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\公众padding-left\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众padding-right\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众padding-top\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众page-break-after\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\公众page-break-before\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\公众page-break-inside\公众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\公众perspective\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ + SPEEDX_STYLE_MS; $SPEEDX_STYLE_ATTR[\"大众perspective-origin\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ + SPEEDX_STYLE_MS; $SPEEDX_STYLE_ATTR[\"大众pointer-events\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众position\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众quotes\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众resize\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_MOZ ; $SPEEDX_STYLE_ATTR[\公众right\公众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众scrollbar-3dlight-color\公众] = SPEEDX_STYLE_W3C;//只有IE6.0支持 $SPEEDX_STYLE_ATTR[\"大众scrollbar-arrow-color\公众] = SPEEDX_STYLE_W3C;//只有IE6.0支持 $SPEEDX_STYLE_ATTR[\"大众scrollbar-base-color\"大众] = SPEEDX_STYLE_W3C;//只有IE6.0支持 $SPEEDX_STYLE_ATTR[\"大众scrollbar-darkshadow-color\"大众] = SPEEDX_STYLE_W3C;//只有IE6.0支持 $SPEEDX_STYLE_ATTR[\"大众scrollbar-face-color\"大众] = SPEEDX_STYLE_W3C;//只有IE6.0支持 $SPEEDX_STYLE_ATTR[\公众scrollbar-highlight-color\"大众] = SPEEDX_STYLE_W3C;//只有IE6.0支持 $SPEEDX_STYLE_ATTR[\"大众scrollbar-shadow-color\"大众] = SPEEDX_STYLE_W3C;//只有IE6.0支持 $SPEEDX_STYLE_ATTR[\"大众scrollbar-shadow-color\公众] = SPEEDX_STYLE_W3C;//只有IE6.0支持 $SPEEDX_STYLE_ATTR[\"大众table-layout\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众tab-size\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_MOZ ; $SPEEDX_STYLE_ATTR[\"大众text-align\公众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众text-align-last\公众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_MOZ ; $SPEEDX_STYLE_ATTR[\"大众text-decoration\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\公众text-decoration-color\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\"大众text-decoration-line\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\"大众text-decoration-skip\公众] = SPEEDX_STYLE_WEBKIT;//只有部分webkit支持 $SPEEDX_STYLE_ATTR[\"大众text-decoration-style\公众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ;//只有部分webkit支持,火狐支持，其它不支持 $SPEEDX_STYLE_ATTR[\"大众text-indent\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\公众text-justify\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众text-overflow\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\公众text-shadow\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\公众text-size-adjust\"大众] = SPEEDX_STYLE_WEBKIT; $SPEEDX_STYLE_ATTR[\"大众text-transform\公众] = SPEEDX_STYLE_W3C;//只有FF高版本支持 $SPEEDX_STYLE_ATTR[\"大众text-underline-position\"大众] = SPEEDX_STYLE_WEBKIT;//只有部分webkit支持 $SPEEDX_STYLE_ATTR[\"大众top\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众transform\公众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ + SPEEDX_STYLE_MS; $SPEEDX_STYLE_ATTR[\"大众transform-origin\公众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ + SPEEDX_STYLE_MS; $SPEEDX_STYLE_ATTR[\公众transform-style\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ + SPEEDX_STYLE_MS; $SPEEDX_STYLE_ATTR[\公众transition\公众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\公众transition-delay\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\"大众transition-duration\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\公众transition-property\公众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\"大众transition-timing-function\"大众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ; $SPEEDX_STYLE_ATTR[\公众transparent\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\公众user-select\公众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT + SPEEDX_STYLE_MOZ + SPEEDX_STYLE_MS; $SPEEDX_STYLE_ATTR[\"大众vertical-align\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众visibility\公众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众white-space\公众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_MOZ ; $SPEEDX_STYLE_ATTR[\公众width\公众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众word-break\"大众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众word-spacing\公众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\公众word-wrap\公众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众writing-mode\公众] = SPEEDX_STYLE_W3C + SPEEDX_STYLE_WEBKIT; $SPEEDX_STYLE_ATTR[\"大众z-index\公众] = SPEEDX_STYLE_W3C; $SPEEDX_STYLE_ATTR[\"大众zoom\公众] = SPEEDX_STYLE_W3C; ?>
有一些配置是为自定义工具函数定义的，到后面用的时候会有解释
实体定义我们选从CSS属性类开始，我定义为speedx_css_item,其定义如下，内有解释
/ CSS属性类，用于创建兼容的CSS属性 测试文件：test.class_speedx_style_item.php @$name: 属性名，造孽的属性名会被删除。当传入的是完全的“属性名：属性值”对时,如：'width:200px;'，后面的参数会被忽略， @$value: 属性值。 @$important: 是否添加!important标识 /class speedx_css_item{ public $name = null; public $value = null; public $browser = SPEEDX_STYLE_DEFAULT;//系统默认支持的浏览器，默认为兼容模式 private $important = false; private function _analysis_(){ $this->name = is_null($this->name) ? null : trim($this->name.\"大众\"大众); $this->value = is_null($this->value) ? null : trim($this->value.\"大众\"大众); $this->important = is_bool($this->important) ? $this->important : false; $attrList = []; $attrValue = []; $cssNameTpl = [ //定义输出格式中属性名部分的前缀格式 \"大众w3c\公众=>\公众<cssName>\"大众, \公众ms\"大众 =>\"大众-ms-<cssName>\公众, \"大众moz\"大众 => \"大众-moz-<cssName>\"大众, \公众webkit\公众=>\公众-webkit-<cssName>\公众, \公众o\"大众 => \"大众-o-<cssName>\公众, ]; $cssValueTpl = [ //定义输出格式中属性值部分的前缀格式 \公众w3c\"大众=>\"大众<cssValue><important>;\"大众, \"大众ms\"大众 =>\"大众-ms-<cssValue><important>;\"大众, \公众moz\"大众 => \"大众-moz-<cssValue><important>;\公众, \"大众webkit\公众=>\"大众-webkit-<cssValue><important>;\"大众, \"大众o\"大众 => \公众-o-<cssValue><important>;\"大众, ]; $cssName = $this->name; $cssValue = $this->value; //去除参数中多余的空格 $preg[] = '/(\s)+/'; $preg[] = '/\s(\()\s/'; $preg[] = '/\s(\))\s/'; $preg[] = '/\s(,)\s/'; $cssValue = preg_replace($preg,\"大众$1\公众,$cssValue); if(empty($cssName) || is_empty($cssValue))return \"大众\"大众; $cssName = strtolower($cssName); $this->value = $cssValue; $SPEEDX_STYLE_ATTR = $GLOBALS[\"大众SPEEDX_STYLE_ATTR\"大众]; if(!isset($SPEEDX_STYLE_ATTR[$cssName]))return \公众\公众; $SPEEDX_STYLE_VALUE = $GLOBALS[\"大众SPEEDX_STYLE_VALUE\"大众]; $SPEEDX_STYLE_FUNCTION = $GLOBALS[\公众SPEEDX_STYLE_FUNCTION\"大众]; $SPEEDX_STYLE_SHOW = $GLOBALS[\"大众SPEEDX_STYLE_SHOW\公众]; //将参数解析为对应的浏览器所组成的数组。 $func = function($pa){ $brw = decomposeBinary($pa); $key = []; foreach($brw as $val){ if($val === SPEEDX_STYLE_W3C)$key[] = \公众w3c\公众; if($val === SPEEDX_STYLE_MOZ)$key[] = \"大众moz\公众; if($val === SPEEDX_STYLE_WEBKIT)$key[] = \公众webkit\公众; if($val === SPEEDX_STYLE_MS)$key[] = \公众ms\"大众; if($val === SPEEDX_STYLE_O)$key[] = \"大众o\"大众; } return $key; }; //解析当前CSS属性所被许可支持的浏览器列表(数组) $allowBrower = null; if($this->browser === SPEEDX_STYLE_DEFAULT){ $allowBrower = $func($SPEEDX_STYLE_SHOW); }else{ $allowBrower = $func($this->browser); } if(empty($allowBrower))return \公众\"大众; //解析当前CSS属性值所被支持的浏览器列表(数组)，列表中必须包含\公众w3c\"大众标准值。 if(!in_array(\"大众w3c\"大众,$allowBrower))$allowBrower[] = \"大众w3c\公众; //属性值的解析是在属性存在的情形下进行的，以下分别对CSS属性及属性值进行解析，分别得出相应浏览器支持情形。 //判断属性值是不是CSS函数，如果是函数，则输出支持的浏览器数组 $isFunction = false; //为ture时表示是函数 $funcBrowser = [SPEEDX_STYLE_NULL]; foreach($SPEEDX_STYLE_FUNCTION as $key => $value){ if(strpos($cssValue,$key) === 0){ $isFunction = true; $funcBrowser = $func($value); } } if($isFunction){ if(empty($funcBrowser))return \"大众\"大众; foreach($funcBrowser as $val){ if(in_array($val,$allowBrower)){ $attrValue[$val] = $cssValueTpl[$val]; } } }else{ / $SPEEDX_STYLE_VALUE是全局定义的CSS属性值列表（数组），有些CSS属性的值是固定的， 有些CSS属性值除了固定值值以外也支持自定义的值。在$SPEEDX_STYLE_VALUE中定义如下： $SPEEDX_STYLE_VALUE[CSS属性][\公众BASIC-SUPPORT\"大众]:基本支持的属性值，这些值目前为止所有浏览器都支持，用\"大众w3c\"大众表示； $SPEEDX_STYLE_VALUE[CSS属性][\"大众USER-DEFINE\"大众]：自定义属性，运用于标准格式\公众w3c\"大众; $SPEEDX_STYLE_VALUE[CSS属性][其它固定值]：不同的浏览器支持情形不同，分别用\"大众w3c\"大众,\"大众webkit\公众,\"大众moz\"大众,\"大众ms\"大众,\"大众o\"大众表示； 其它解释详情拜会配置文件：config.speedx.php / if(isset($SPEEDX_STYLE_VALUE[$this->name])){ if(isset($SPEEDX_STYLE_VALUE[$this->name][$cssValue])){ $brw = $func($SPEEDX_STYLE_VALUE[$this->name][$cssValue]); if(empty($brw))return \"大众\"大众; foreach($brw as $val){ if(in_array($val,$allowBrower)){ $attrValue[$val] = $cssValueTpl[$val]; } } }else{ if(in_array($cssValue,$SPEEDX_STYLE_VALUE[$this->name][\公众BASIC-SUPPORT\"大众],true)){ $attrValue[\公众w3c\"大众] = $cssValueTpl[\"大众w3c\公众]; }else{ if(isset($SPEEDX_STYLE_VALUE[$this->name][\"大众USER-DEFINE\"大众])){ $attrValue[\公众w3c\"大众] = $cssValueTpl[\"大众w3c\"大众]; } } } }else{ $attrValue[\公众w3c\公众] = $cssValueTpl[\"大众w3c\"大众]; } } //解析CSS属性浏览器支持情形： $brw = $func($SPEEDX_STYLE_ATTR[$this->name]); if(empty($brw))return \"大众\公众; foreach($brw as $val){ if(in_array($val,$allowBrower)){ $attrList[$val] = $cssNameTpl[$val]; } } foreach($attrList as $key => $val){ if(isset($attrValue[$key])){ $attrList[$key] = $attrList[$key] . \"大众:\公众 . $attrValue[$key]; $attrValue[$key] = \"大众\公众; }else{ $attrList[$key] = $attrList[$key] . \"大众:\"大众 . $cssValueTpl[\"大众w3c\公众]; } } if(isset($attrList[\"大众w3c\"大众])){ $w3c = []; $w3c[] = $attrList[\"大众w3c\"大众]; foreach($attrValue as $val){ if(!empty($val)){ $w3c[] = $cssNameTpl[\"大众w3c\"大众] . \"大众:\"大众 . $val; } } $w3c = implode(\"大众\"大众,$w3c); $attrList[\"大众w3c\公众] = $w3c; } $CSS = implode(\"大众\"大众,$attrList); $important = $this->important ? \"大众 !important\"大众 : \"大众\"大众; $CSS = str_replace(['<cssName>','<cssValue>','<important>'],[$this->name,$this->value,$important],$CSS); return $CSS; } / @cssName: CSS属性名称 @cssValue: CSS属性值 @important: 是否加!important 加权，false不加，true:为加这一属性 / public function __construct($cssName = null,$cssValue = null,$important = false){ $cssName = trim($cssName.\"大众\"大众); $cssName = empty($cssName) ? null : $cssName; $cssValue = trim($cssValue . \公众\"大众); $cssValue = trim(rtrim($cssValue,\公众;\"大众)); $cssValue = empty($cssValue) ? null : $cssValue; $important = is_bool($important) ? $important : false; $this->name = $cssName; $this->value = $cssValue; $this->important = provValue(false,[true,false],$important); } public function __toString(){ return $this->_analysis_(); }}
以下是我设计的干系操作函数，方便布局工具
function provValue($nullValue = null,$rightfulValues = [],$givingValue = null){ if(in_array($givingValue,$rightfulValues,true)){ return $givingValue; }else { return $nullValue; }}/ 创建样式属性节点 @name : 属性名 @value: 属性值 @imp : !important加权 /function create_css_item($name=null,$value=null,$imp = false){ return new speedx_css_item($name,$value,$imp);}/ 从字符串创建单一CSS样式属性节点， @input为包含属性对的字符串(即属性名：属性值，如：‘width:100px;’); 把稳，一次只能创建一个样式属性，包含多余的属性对时，会被舍弃 /function create_css_item_from_string($input=\"大众\"大众){ $input = trim($input.\公众\"大众); $name = null; $valu = null; $impt = false; $preg = \"大众/(\/\[^\/]\\/)|(-webkit-)|(-moz-)|(-ms-)|(-o-)/\"大众; $input = preg_replace($preg,\公众\公众,$input); $preg = '/([\w\-]+)\s\:\s([^;!]+)\s(!important)/i'; if(preg_match($preg,$input,$_classItem)){ $name = isset($_classItem[1]) ? trim($_classItem[1]) : null; $valu = isset($_classItem[2]) ? trim($_classItem[2]) : null; $impt = isset($_classItem[3]) ? true : false; }else{ $name = is_null($name) ? null : trim($name.\"大众\"大众); $valu = is_null($valu) ? null : trim($valu.\"大众\公众); } $item = new speedx_css_item($name,$valu,$impt); if(empty($item . \公众\公众))return null; return $item;}/ 从字符串创建CSS样式属性节点，如果有多个属性对，字符串应以“;\公众号隔开， 创建的多个属性节点以数组的形式返回，创建失落败返回null; @string为包含属性字符描述的字符串，如：‘width:100px; border:1px solid grayd;\公众等。 /function create_css_items_from_string($string){ $classItems = []; if(is_string($string)){ $string = trim($string); $preg = \"大众/(\/\[^\/]\\/)|(-webkit-)|(-moz-)|(-ms-)|(-o-)/\公众; $string = preg_replace($preg,\"大众\"大众,$string); if(!empty($string)){ $string = explode(\"大众;\"大众,$string); $items = []; foreach($string as $_item){ $_item = trim($_item); if(!empty($_item)){ $items[] = $_item; } } unset($string); $items = array_unique($items); foreach($items as $item){ $item = create_css_item_from_string($item); if(!is_null($item)){ $classItems[] = $item; } } } } if(empty($classItems))return null; return $classItems;}
现在我们来测试一下，代码如下：
$item1 = create_css_item_from_string(\公众width:100px\"大众);$item2 = create_css_item_from_string(\"大众display:inline-box;\"大众);$item3 = create_css_item_from_string(\公众position:sticky;\公众);$item4 = create_css_item(\"大众display\"大众,\"大众inline-flexbox\公众,true);$item5 = create_css_item(\公众cursor\"大众,\公众zoom-out\公众,true);$item6 = create_css_item_from_string('background-clip: padding-box !important;');$item7 = create_css_item_from_string('border-bottom-left-radius: repeating-linear-gradient ( 180deg, #f00 , #ff0 , 10%, #f00 , 15%);');echo $item1 .\"大众<br/>\"大众;echo $item2 .\"大众<br/>\公众;echo $item3 .\公众<br/>\公众;echo $item4 .\"大众<br/>\公众;echo $item5 .\公众<br/>\"大众;echo $item6 .\"大众<br/>\公众;echo $item7 .\"大众<br/>\"大众;
结果如下：
width:100px;-ms-display:inline-box;-webkit-display:-webkit-inline-box;-moz-display:-moz-inline-box;display:inline-box;position:sticky;position:-webkit-sticky;-ms-display:-ms-inline-flexbox !important;-webkit-display:inline-flexbox !important;-moz-display:inline-flexbox !important;display:inline-flexbox !important;cursor:zoom-out !important;cursor:-webkit-zoom-out !important;cursor:-moz-zoom-out !important;-webkit-background-clip:padding-box !important;-moz-background-clip:padding-box !important;background-clip:padding-box !important;-webkit-border-bottom-left-radius:-webkit-repeating-linear-gradient(180deg,#f00,#ff0,10%,#f00,15%);-moz-border-bottom-left-radius:-moz-repeating-linear-gradient(180deg,#f00,#ff0,10%,#f00,15%);border-bottom-left-radius:repeating-linear-gradient(180deg,#f00,#ff0,10%,#f00,15%);
彷佛还不错的样子。待续
