动态加载功能模块js与css的方法、装置及存储介质与流程

1.本发明涉及前端软件开发技术领域，具体地说是动态加载功能模块js与css的方法、装置及存储介质。


背景技术：

2.在h5 web前端开发过程中，当需要引入编写的业务模块实现js与css文件时，现有的技术即通过html的《script》以及《link》标签引入。而当同一页面功能模块过多，或者业务过于繁杂时，依靠html单一的标签的引入则会变得混乱且不易于管理。


技术实现要素：

3.本发明的技术任务是针对以上不足之处，提供动态加载功能模块js与css的方法、装置及存储介质，能够有条理的管理功能模块，一定程度上也提高了代码编写者思路的清晰度。
4.本发明解决其技术问题所采用的技术方案是：动态加载功能模块js与css的方法，该方法基于h5+javascript实现动态加载功能模块js与css文件，该方法的实现方式如下：首先创建一个目录a；于目录a下创建一个js文件，设其命名为m.js；于目录a下创建一个目录b，目录b用于存放所有模块代码，设定存放规则为模块目录与内部文件名称一致；于js文件中声明一个json对象m；json对象m中添加一个用于加载模块的属性，该属性需要的参数包括页面中所需的所有功能模块以及目前需要加载的功能模块；该属性的实现逻辑为：步骤s1：获取当前文件路径；步骤s2：删除所有模块代码引入；步骤s3：引入所需要的功能模块代码。
5.本方法为动态加载代码模块，通过简单控制几个变量，即可解决h5 web前端引入功能模块代码混乱，不易于管理的问题。尤其是对于同一页面不同业务所需功能分离度高的时候，此方法可有条理的管理功能模块，一定程度上页提高了代码编写者思路的清晰度。
6.进一步的，所述目录a下创建一个目录b，创建code模块代码实现如下：于目录b下创建code目录；于code目录下创建code.js以及code.css文件。
7.优选的，所述页面中所需的所有功能模块为字符数组，设该字符数组命名为moudles；目前需要加载的功能模块为字符数组，设该字符数组命名为needs；则所述步骤s1，具体实现逻辑如下：设该路径命名为path，通过dom层的document.scripts获取到当前页面所引用的
所有js；循环遍历判断每一个script对象的src属性截取值：截取最后一个“/”与“.”中间的字符串，是否与当前script名称一致，若一致，则截取src第一个字符至最后一个“/”的字符串，该字符串即为当前文件路径；由于通过js名称进行判断，因此其余引用的js不可与当前文件名称重复。而此问题可视为极易规避的问题。
8.所述步骤s2，具体实现逻辑如下：遍历参数moudles，利用每一个moudles的值进行如下操作：通过dom层的document.getelementbyid()方法，根据每一个moudles的值拼接“script”以及“css”作为id获取引入js以及css的html元素，判断是否为空，不为空则利用html元素对象的remove()方法进行移除；所述步骤s3，具体实现逻辑如下：遍历参数needs，利用每一个needs的值进行如下操作：步骤3.1、引入css：通过dom层的document.createelement()方法创建link元素对象，通过dom层document.getelementsbytagname('head')[0].appendchild()代码将link元素放入页面中，即获取页面中所有“head”标签元素取，第一个元素将所创建的link元素作为孩子元素放入；以此便将css文件引入到当前页面；步骤3.2、引入js：通过dom层的document.createelement()方法创建script元素对象，通过dom层document.getelementsbytagname('head')[0].appendchild()代码将script元素放入页面中，即获取页面中所有“head”标签元素取，第一个元素将所创建的script元素作为孩子元素放入；以此便将js文件引入到当前页面。
[0009]
优选的，对link元素对象设置属性如下：id 为每一个needs的值拼接
ꢀ“
css”,rel为“stylesheet”,href 为步骤s1获取的路径path拼接
ꢀ“
moudles/”+ 每一个needs的值 + 每一个needs的值 +
ꢀ“
.css”；若此needs的值为 code，则href为：path +
ꢀ“
moudles/
”ꢀ
+
ꢀ“
code
”ꢀ
+
ꢀ“
.css”。
[0010]
优选的，对script元素对象设置属性如下：id 为每一个needs的值拼接
ꢀ“
script”,type为“text/javascript”,src为步骤s1获取的路径path拼接
ꢀ“
moudles/”+ 每一个needs的值 + 每一个needs的值 +
ꢀ“
.js”；若此needs的值为 code，则src为：path +
ꢀ“
moudles/
”ꢀ
+
ꢀ“
code
”ꢀ
+
ꢀ“
.js”。
[0011]
优选的，设有code1和code2两个业务模块，当业务模块只用到code1时，调用manager.load([’code1’,’code2’],[’code1’])，过程如下：（1）、获取当前文件路径path；（2）、遍历参数moudles，将code1及code2相关的js与css文件移除；（3）、遍历参数needs，将code1相关的js与css文件引入。
[0012]
进一步的，移除操作如下：（2.1）、遍历参数moudles，获取每一个moudles的值，取名为moudle；（2.2）、通过document.getelementsbyld（moudle+
‘
css’）获取元素；（2.3）、判断获取元素是否为空，不为空则调用remove()进行移除。
[0013]
进一步的，引入操作如下：（3.1）、遍历参数needs，获取每一个needs的值，取名为need；（3.2）、通过document.createelement(
‘
link’)创建link元素，设置属性：id ：needs+“css”rel：“stylesheet”href：path +
ꢀ“
moudles/
”ꢀ
+
ꢀ“
code
”ꢀ
+
ꢀ“
.css”通过document.getelementsbytagname('head')[0].appendchild()引入页面；（3.3）、通过document.createelement(
‘
script’)创建script元素，设置属性：id ：needs+“script”type：“text/javascript”src：path +“moudles/”+“code”+
ꢀ“
.js”通过document.getelementsbytagname('head')[0].appendchild()引入页面。
[0014]
本发明还要求保护动态加载功能模块js与css的装置，包括：至少一个存储器和至少一个处理器；所述至少一个存储器，用于存储机器可读程序；所述至少一个处理器，用于调用所述机器可读程序，实现上述的方法。
[0015]
本发明还要求保护存储介质，所述存储介质上存储有计算机指令，所述计算机指令在被处理器执行时，使所述处理器执行上述的方法。
[0016]
本发明的动态加载功能模块js与css的方法、装置及存储介质与现有技术相比，具有以下有益效果：本方法基于h5 + javascript，具备动态引入js与css的功能，具有高易用性；通过使用本方法，只需要在web环境下，将代码以及目录结构按照如上所述健全，即可自由使用；该方法易用性高，操作简单，传参简单。管理方便，不混乱。
附图说明
[0017]
图1是本发明实施例提供的创建目录结构示图；图2是本发明实施例提供的业务模块只用到code1时的方法实现逻辑示图；图3是本发明实施例提供的移除操作的示意图；图4是本发明实施例提供的引入操作的示意图；图5本发明实施例提供的code1代码引入效果展示示图。
具体实施方式
[0018]
本发明实施例提供动态加载功能模块js与css的方法，该方法基于h5+javascript实现动态加载功能模块js与css文件，该方法的实现方式如下：
1、首先创建一个目录，为方便阐述，此目录取名functions。
[0019]
2、于functions下创建一个js文件，为方便阐述，此文件取名为manager.js。
[0020]
3、于functions下创建一个目录，为方便阐述，此目录取名moudles，该目录用于存放所有模块代码，设定存放规则为模块目录与内部文件名称一致；如创建code模块代码，举例如下：于moudles下创建code目录；于code目录下创建code.js以及code.css文件。
[0021]
4、于js文件中声明一个json对象，为方便阐述，此对象取名manager。
[0022]
5、manager对象中添加一个用于加载模块的属性，为方便阐述，此属性取名load，该属性为一个方法；方法需要的参数包括：页面中所需的所有功能模块（字符数组）：为方便阐述，此数组名取moudles；目前需要加载的功能模块（字符数组）：为方便阐述，此数组名取needs。
[0023]
6、load 方法实现逻辑如下：（1）、获取当前文件路径，为方便阐述，此路径取名path；通过dom层的document.scripts获取到当前页面所引用的所有js；循环遍历判断每一个script对象的src属性截取值（截取最后一个“/”与“.”中间的字符串）是否与当前script名称是否一致，若一致，则截取src第一个字符至最后一个“/”的字符串；该字符串即为当前文件路径。
[0024]
备注：由于通过js名称进行判断，因此其余引用的js不可与当前文件名称重复。而此问题可视为极易规避的问题。
[0025]
（2）、删除所有模块代码引入；遍历参数moudles，利用每一个moudles的值进行如下操作：通过dom层的document.getelementbyid()方法，根据每一个moudles的值拼接“script”以及“css”作为id获取引入js以及css的html元素，判断是否为空，不为空则利用html元素对象的remove()方法进行移除。
[0026]
（3）、引入所需要的功能模块代码；遍历参数needs，利用每一个needs的值进行如下操作：（a）、引入css：通过dom层的document.createelement()方法创建link元素对象；对该对象设置属性：id 为每一个needs的值拼接
ꢀ“
css”，rel为“stylesheet”，href 为（1）获取的路径（path）拼接
ꢀ“
moudles/”+ 每一个needs的值 + 每一个needs的值 +
ꢀ“
.css”。若此needs的值为 code，则href为：path +
ꢀ“
moudles/
”ꢀ
+
ꢀ“
code
”ꢀ
+
ꢀ“
.css”通过dom层document.getelementsbytagname('head')[0].appendchild()代码将link元素放入页面中，因此便将css文件引入到当前页面。
[0027]
代码解释：获取页面中所有“head”标签元素取，第一个元素将所创建的link元素作为孩子元素放入。
[0028]
（b）、引入js：通过dom层的document.createelement()方法创建script元素对象；对该对象设置属性：id 为每一个needs的值拼接
ꢀ“
script”，type为“text/javascript”，src为（1）获取的路径（path）拼接
ꢀ“
moudles/”+ 每一个needs的值 + 每一个needs的值 +
ꢀ“
.js”。若此needs的值为 code，则src为：path +
ꢀ“
moudles/
”ꢀ
+
ꢀ“
code
”ꢀ
+
ꢀ“
.js”通过dom层document.getelementsbytagname('head')[0].appendchild()代码将script元素放入页面中，因此便将js文件引入到当前页面。
[0029]
代码解释：获取页面中所有“head”标签元素取，第一个元素将所创建的script元素作为孩子元素放入。
[0030]
以code1以及code2两个业务模块举例说明。
[0031]
其目录结构如图1所示；manager.js，具备json对象manager，其中包含方法属性load(moudles,needs)；当业务模块只用到code1时，调用manager.load([’code1’,’code2’],[’code1’])，过程如图2所示：1）、获取当前文件路径path；2）、遍历参数moudles，将code1及code2相关的js与css文件移除；3）、遍历参数needs，将code1相关的js与css文件引入。
[0032]
移除操作如图3所示：2.1）、遍历参数moudles，获取每一个moudles的值，取名为moudle；2.2）、通过document.getelementsbyld（moudle+
‘
css’）获取元素；2.3）、判断获取元素是否为空，不为空则调用remove()进行移除。
[0033]
引入操作如图4所示：3.1）、遍历参数needs，获取每一个needs的值，取名为need；3.2）、通过document.createelement(
‘
link’)创建link元素，设置属性：id ：needs+“css”rel：“stylesheet”href：path +
ꢀ“
moudles/
”ꢀ
+
ꢀ“
code
”ꢀ
+
ꢀ“
.css”通过document.getelementsbytagname('head')[0].appendchild()引入页面；3.3）、通过document.createelement(
‘
script’)创建script元素，设置属性：id ：needs+“script”type：“text/javascript”src：path +“moudles/”+“code”+
ꢀ“
.js”通过document.getelementsbytagname('head')[0].appendchild()引入页面。
[0034]
下面结合代码举例说明本方法的实现：1、如图1所示，首先创建目录结构；2、manager.js写入如下代码：
var manager = {
ꢀꢀꢀ
load: function (moudles, needs) {
ꢀꢀꢀꢀꢀꢀꢀ
var path = getpath();
ꢀꢀꢀꢀꢀꢀꢀ
for(var i =0;i《moudles.length;i++){
ꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀ
if(document.getelementbyid(moudles[i] +"script") != null){
ꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀ
document.getelementbyid(moudles[i] +"script").remove();
ꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀ
}
ꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀ
if(document.getelementbyid(moudles[i] +"css") != null){
ꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀ
document.getelementbyid(moudles[i] +"css").remove();
ꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀ
}
ꢀꢀꢀꢀꢀꢀꢀ
}
ꢀꢀꢀꢀꢀꢀꢀ
for (var i = 0; i《needs.length; i++) {
ꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀ
var link = document.createelement("link");
ꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀ
link.id = needs[i] +"css";
ꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀ
link.rel = "stylesheet";
ꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀ
link.href = path + "moudles/" + needs[i] + "/" +needs[i]+ ".css" ;
ꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀ
document.getelementsbytagname("head")[0].appendchild(link);
ꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀ
var script = document.createelement("script") ;
ꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀ
script.id = needs[i] + "script";
ꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀ
script.type = "text/javascript" ;
ꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀ
script.src = path + "moudles/" + needs[i] + "/" + needs[i]+ ".js";
ꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀ
document.getelementsbytagname("head")[0].appendchild(script);
ꢀꢀꢀꢀꢀꢀꢀ
}
ꢀꢀꢀꢀꢀꢀꢀ
function getpath(){
ꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀ
var path = "";
ꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀ
var scripts = document.scripts;
ꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀ
for(var i = 0;i《scripts.length;i++){
ꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀ
var srcstr = scripts[i].src;
ꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀ
var name = srcstr.substring(srcstr.lastindexof("/") + 1 , srcstr.lastindexof("."))
ꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀ
if(name == "manager") {
ꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀ
path = srcstr.substring(0, srcstr.lastindexof("/") + 1);
ꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀ
break;
ꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀ
}
ꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀ
}
ꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀ
return path;
ꢀꢀꢀꢀꢀꢀꢀ
}
ꢀꢀꢀ
}}3、于使用的页面中引入manager.js，并执行调用：《script src ="./functions/manaqer.js"》《/script》《script》manager. load([
‘
codel’,
‘
code2’],[
‘
codel’])《/script》4、code1代码引入效果，code1代码如下：console.log("效果展示")最终效果展示如图5所示。
[0035]
本发明实施例还提供一种动态加载功能模块js与css的装置，包括：至少一个存储器和至少一个处理器；所述至少一个存储器，用于存储机器可读程序；所述至少一个处理器，用于调用所述机器可读程序，实现上述实施例所述的动态加载功能模块js与css方法。
[0036]
本发明实施例还提供一种存储介质，所述计算机可读介质上存储有计算机指令，所述计算机指令在被处理器执行时，使所述处理器执行上述实施例中所述的动态加载功能模块js与css的方法。具体地，可以提供配有存储介质的系统或者装置，在该存储介质上存储着实现上述实施例中任一实施例的功能的软件程序代码，且使该系统或者装置的计算机（或cpu或mpu）读出并执行存储在存储介质中的程序代码。
[0037]
在这种情况下，从存储介质读取的程序代码本身可实现上述实施例中任何一项实施例的功能，因此程序代码和存储程序代码的存储介质构成了本发明的一部分。
[0038]
用于提供程序代码的存储介质实施例包括软盘、硬盘、磁光盘、光盘（如cd-rom、cd-r、cd-rw、dvd-rom、dvd-ram、dvd-rw、dvd+rw）、磁带、非易失性存储卡和rom。可选择地，可以由通信网络从服务器计算机上下载程序代码。
[0039]
此外，应该清楚的是，不仅可以通过执行计算机所读出的程序代码，而且可以通过基于程序代码的指令使计算机上操作的操作系统等来完成部分或者全部的实际操作，从而实现上述实施例中任意一项实施例的功能。
[0040]
此外，可以理解的是，将由存储介质读出的程序代码写到插入计算机内的扩展板中所设置的存储器中或者写到与计算机相连接的扩展单元中设置的存储器中，随后基于程序代码的指令使安装在扩展板或者扩展单元上的cpu等来执行部分和全部实际操作，从而实现上述实施例中任一实施例的功能。
[0041]
上文通过附图和优选实施例对本发明进行了详细展示和说明，然而本发明不限于这些已揭示的实施例，基与上述多个实施例本领域技术人员可以知晓，可以组合上述不同实施例中的代码审核手段得到本发明更多的实施例，这些实施例也在本发明的保护范围之内。

技术特征：
1.动态加载功能模块js与css的方法，其特征在于，该方法基于h5+javascript实现动态加载功能模块js与css文件，该方法的实现方式如下：首先创建一个目录a；于目录a下创建一个js文件，设其命名为m.js；于目录a下创建一个目录b，目录b用于存放所有模块代码，设定存放规则为模块目录与内部文件名称一致；于js文件中声明一个json对象m；json对象m中添加一个用于加载模块的属性，该属性需要的参数包括页面中所需的所有功能模块以及目前需要加载的功能模块；该属性的实现逻辑为：步骤s1：获取当前文件路径；步骤s2：删除所有模块代码引入；步骤s3：引入所需要的功能模块代码。2.根据权利要求1所述的动态加载功能模块js与css的方法，其特征在于，所述目录a下创建一个目录b，创建code模块代码实现如下：于目录b下创建code目录；于code目录下创建code.js以及code.css文件。3.根据权利要求1或2所述的动态加载功能模块js与css的方法，其特征在于，所述页面中所需的所有功能模块为字符数组，设该字符数组命名为moudles；目前需要加载的功能模块为字符数组，设该字符数组命名为needs；则所述步骤s1，具体实现逻辑如下：设该路径命名为path，通过dom层的document.scripts获取到当前页面所引用的所有js；循环遍历判断每一个script对象的src属性截取值：截取最后一个“/”与“.”中间的字符串，是否与当前script名称一致，若一致，则截取src第一个字符至最后一个“/”的字符串，该字符串即为当前文件路径；所述步骤s2，具体实现逻辑如下：遍历参数moudles，利用每一个moudles的值进行如下操作：通过dom层的document.getelementbyid()方法，根据每一个moudles的值拼接“script”以及“css”作为id获取引入js以及css的html元素，判断是否为空，不为空则利用html元素对象的remove()方法进行移除；所述步骤s3，具体实现逻辑如下：遍历参数needs，利用每一个needs的值进行如下操作：步骤3.1、引入css：通过dom层的document.createelement()方法创建link元素对象，通过dom层document.getelementsbytagname('head')[0].appendchild()代码将link元素放入页面中，即获取页面中所有“head”标签元素取，第一个元素将所创建的link元素作为孩子元素放入；以此便将css文件引入到当前页面；步骤3.2、引入js：通过dom层的document.createelement()方法创建script元素对象，通过dom层document.getelementsbytagname('head')[0].appendchild()代码将script元素放入页面中，即获取页面中所有“head”标签元素取，第一个元素将所创建的
script元素作为孩子元素放入；以此便将js文件引入到当前页面。4.根据权利要求3所述的动态加载功能模块js与css的方法，其特征在于，对link元素对象设置属性如下：id 为每一个needs的值拼接
ꢀ“
css”,rel为“stylesheet”,href 为步骤s1获取的路径path拼接
ꢀ“
moudles/”+ 每一个needs的值 + 每一个needs的值 +
ꢀ“
.css”；若此needs的值为 code，则href为：path +
ꢀ“
moudles/
”ꢀ
+
ꢀ“
code
”ꢀ
+
ꢀ“
.css”。5.根据权利要求4所述的动态加载功能模块js与css的方法，其特征在于，对script元素对象设置属性如下：id 为每一个needs的值拼接
ꢀ“
script”,type为“text/javascript”,src为步骤s1获取的路径path拼接
ꢀ“
moudles/”+ 每一个needs的值 + 每一个needs的值 +
ꢀ“
.js”；若此needs的值为 code，则src为：path +
ꢀ“
moudles/
”ꢀ
+
ꢀ“
code
”ꢀ
+
ꢀ“
.js”。6.根据权利要求5所述的动态加载功能模块js与css的方法，其特征在于，设有code1和code2两个业务模块，则当业务模块只用到code1时，调用manager.load([’code1’,’code2’],[’code1’])，过程如下：（1）、获取当前文件路径path；（2）、遍历参数moudles，将code1及code2相关的js与css文件移除；（3）、遍历参数needs，将code1相关的js与css文件引入。7.根据权利要求6所述的动态加载功能模块js与css的方法，其特征在于，移除操作如下：（2.1）、遍历参数moudles，获取每一个moudles的值，取名为moudle；（2.2）、通过document.getelementsbyld（moudle+
‘
css’）获取元素；（2.3）、判断获取元素是否为空，不为空则调用remove()进行移除。8.根据权利要求6所述的动态加载功能模块js与css的方法，其特征在于，引入操作如下：（3.1）、遍历参数needs，获取每一个needs的值，取名为need；（3.2）、通过document.createelement(
‘
link’)创建link元素，设置属性：id ：needs+“css”rel：“stylesheet”href：path +
ꢀ“
moudles/
”ꢀ
+
ꢀ“
code
”ꢀ
+
ꢀ“
.css”通过document.getelementsbytagname('head')[0].appendchild()引入页面；（3.3）、通过document.createelement(
‘
script’)创建script元素，设置属性：id ：needs+“script”type：“text/javascript”src：path +“moudles/”+“code”+
ꢀ“
.js”通过document.getelementsbytagname('head')[0].appendchild()引入页面。
9.动态加载功能模块js与css的装置，其特征在于，包括：至少一个存储器和至少一个处理器；所述至少一个存储器，用于存储机器可读程序；所述至少一个处理器，用于调用所述机器可读程序，实现权利要求1至8任一所述的方法。10.存储介质，其特征在于，所述存储介质上存储有计算机指令，所述计算机指令在被处理器执行时，使所述处理器执行权利要求1至8任一所述的方法。

技术总结
本发明公开了动态加载功能模块js与css的方法、装置及存储介质，属于前端软件开发技术领域，该方法基于H5+Javascript实现动态加载功能模块js与css文件，该方法的实现方式如下：首先创建一个目录A；于目录A下创建一个js文件，设其命名为m.js；于目录A下创建一个目录B，目录B用于存放所有模块代码，设定存放规则为模块目录与内部文件名称一致；于js文件中声明一个JSON对象m；JSON对象m中添加一个用于加载模块的属性，该属性的实现逻辑为：获取当前文件路径；删除所有模块代码引入；引入所需要的功能模块代码。本发明能够有条理的管理功能模块，一定程度上也提高了代码编写者思路的清晰度。度。度。


技术研发人员：韩光普 张玉新 刘燕 李朋林
受保护的技术使用者：浪潮软件股份有限公司
技术研发日：2023.08.22
技术公布日：2023/9/19