update docs

Signed-off-by: N HelloCrease <lian15@huawei.com>

update docs
Signed-off-by: N HelloCrease <lian15@huawei.com>
2dee3348 · HelloCrease · 3d3c18d5 · 2dee3348 · 2dee3348 · 2dee3348
10 changed file
--- a/en/application-dev/application-dev-guide-for-gitee.md
+++ b/en/application-dev/application-dev-guide-for-gitee.md
@@ -54,8 +54,10 @@ To make you better understand how functions work together and jumpstart your app
 API references encompass all components and APIs available in OpenHarmony, helping you use and integrate APIs more effectively.

 They are organized as follows:
+
+- [Component Reference (TypeScript-based Declarative Development Paradigm)](reference/arkui-ts/Readme-EN.md)
+
 -   [Component Reference (JavaScript-based Web-like Development Paradigm)](reference/arkui-js/Readme-EN.md)
-   [Component Reference (TypeScript-based Declarative Development Paradigm)](reference/arkui-ts/Readme-EN.md)
 -   APIs
    -   [JS and TS APIs](reference/apis/Readme-EN.md)
    -   Native APIs

--- a/en/application-dev/reference/Readme-EN.md
+++ b/en/application-dev/reference/Readme-EN.md
 # Development References

-   [JavaScript-based Web-like Development Paradigm](arkui-js/Readme-EN.md)
-   [TypeScript-based Declarative Development Paradigm](arkui-ts/Readme-EN.md)
+-   [Component Reference(TypeScript-based Declarative Development Paradigm)](arkui-ts/Readme-EN.md)
+-   [Component Reference(JavaScript-based Web-like Development Paradigm)](arkui-js/Readme-EN.md)
 -   [APIs](apis/Readme-EN.md)
-    
+
    -   [JS (eTS Included) APIs](apis/Readme-EN.md)
    -   Native APIs
        -   [Standard Library](native-lib/third_party_libc/musl.md)

--- a/en/application-dev/ui/Readme-EN.md
+++ b/en/application-dev/ui/Readme-EN.md
 # UI Development

 - [ArkUI Overview](arkui-overview.md)
+- TypeScript-based Declarative Development Paradigm
+    - [Overview](ui-ts-overview.md)
+    - Framework Overview
+        - File Organization
+            - [Directory Structure](ts-framework-directory.md)
+            - [Rules for Accessing Application Code Files](ts-framework-file-access-rules.md)
+        - ["js" Tag](ts-framework-js-tag.md)
+        - Resource Access
+            - [Accessing Application Resources](ts-application-resource-access.md)
+            - [Accessing System Resources](ts-system-resource-access.md)
+            - [Media Resource Types](ts-media-resource-type.md)
+        - [Pixel Units](ts-pixel-units.md)
+        - [Types](ts-types.md)
+    - Declarative Syntax
+        - [Overview](ts-syntax-intro.md)
+        - General UI Description Specifications
+            - [Basic Concepts](ts-general-ui-concepts.md)
+            - Declarative UI Description Specifications
+                - [Configuration Without Parameters](ts-parameterless-configuration.md)
+                - [Configuration with Mandatory Parameters](ts-configuration-with-mandatory-parameters.md)
+                - [Attribute Configuration](ts-attribution-configuration.md)
+                - [Event Configuration](ts-event-configuration.md)
+                - [Child Component Configuration](ts-child-component-configuration.md)
+            - Componentization
+                - [@Component](ts-component-based-component.md)
+                - [@Entry](ts-component-based-entry.md)
+                - [@Preview](ts-component-based-preview.md)
+                - [@Builder](ts-component-based-builder.md)
+                - [@Extend](ts-component-based-extend.md)
+                - [@CustomDialog](ts-component-based-customdialog.md)
+                - [@Styles](ts-component-based-styles.md)
+        - About UI State Management
+            - [Basic Concepts](ts-ui-state-mgmt-concepts.md)
+            - Managing Component States
+                - [@State](ts-component-states-state.md)
+                - [@Prop](ts-component-states-prop.md)
+                - [@Link](ts-component-states-link.md)
+            - Managing Application States
+                - [AppStorage](ts-application-states-appstorage.md)
+                - [PersistentStorage](ts-application-states-apis-persistentstorage.md)
+                - [Environment](ts-application-states-apis-environment.md)
+            - Managing Other States
+                - [@Observed and @ObjectLink](ts-other-states-observed-objectlink.md)
+                - [@Consume and @Provide](ts-other-states-consume-provide.md)
+                - [@Watch](ts-other-states-watch.md)
+            - About Rendering Control Syntax
+                - [if/else](ts-rending-control-syntax-if-else.md)
+                - [ForEach](ts-rending-control-syntax-foreach.md)
+                - [LazyForEach](ts-rending-control-syntax-lazyforeach.md)
+        - About @Component
+            - [build Function](ts-function-build.md)
+            - [Initialization of Custom Components' Member Variables](ts-custom-component-initialization.md)
+            - [Custom Component Lifecycle Callbacks](ts-custom-component-lifecycle-callbacks.md)
+            - [Component Creation and Re-initialization](ts-component-creation-re-initialization.md)
+        - [About Syntactic Sugar](ts-syntactic-sugar.md)
+    - Common Component Development Guidelines
+        - [Button](ui-ts-basic-components-button.md)
+        - [Web](ui-ts-components-web.md)
+    - Common Layout Development Guidelines
+        - [Flex Layout](ui-ts-layout-flex.md)
+        - [Grid Layout](ui-ts-layout-grid-container.md)
+        - [Media Query](ui-ts-layout-mediaquery.md)
+    - Experiencing the Declarative UI
+        - [Creating a Declarative UI Project](ui-ts-creating-project.md)
+        - [Getting to Know Components](ui-ts-components.md)
+        - [Creating a Simple Page](ui-ts-creating-simple-page.md)
+    - Defining Page Layout and Connection
+        - [Building a Food Data Model](ui-ts-building-data-model.md)
+        - [Building a Food Category List Layout](ui-ts-building-category-list-layout.md)
+        - [Building a Food Category Grid Layout](ui-ts-building-category-grid-layout.md)
+        - [Implementing Page Redirection and Data Transmission](ui-ts-page-redirection-data-transmission.md)
 - JavaScript-based Web-like Development Paradigm
    - [Overview](ui-js-overview.md)
    - Framework
@@ -73,74 +144,4 @@
                - [Animation Effect](ui-js-animate-dynamic-effects.md)
                - [Animation Frame](ui-js-animate-frame.md)
    - [Custom Components](ui-js-custom-components.md)
- TypeScript-based Declarative Development Paradigm
-    - [Overview](ui-ts-overview.md)
-    - Framework Overview
-        - File Organization
-            - [Directory Structure](ts-framework-directory.md)
-            - [Rules for Accessing Application Code Files](ts-framework-file-access-rules.md)
-        - ["js" Tag](ts-framework-js-tag.md)
-        - Resource Access
-            - [Accessing Application Resources](ts-application-resource-access.md)
-            - [Accessing System Resources](ts-system-resource-access.md)
-            - [Media Resource Types](ts-media-resource-type.md)
-        - [Pixel Units](ts-pixel-units.md)
-        - [Types](ts-types.md)
-    - Declarative Syntax
-        - [Overview](ts-syntax-intro.md)
-        - General UI Description Specifications
-            - [Basic Concepts](ts-general-ui-concepts.md)
-            - Declarative UI Description Specifications
-                - [Configuration Without Parameters](ts-parameterless-configuration.md)
-                - [Configuration with Mandatory Parameters](ts-configuration-with-mandatory-parameters.md)
-                - [Attribute Configuration](ts-attribution-configuration.md)
-                - [Event Configuration](ts-event-configuration.md)
-                - [Child Component Configuration](ts-child-component-configuration.md)
-            - Componentization
-                - [@Component](ts-component-based-component.md)
-                - [@Entry](ts-component-based-entry.md)
-                - [@Preview](ts-component-based-preview.md)
-                - [@Builder](ts-component-based-builder.md)
-                - [@Extend](ts-component-based-extend.md)
-                - [@CustomDialog](ts-component-based-customdialog.md)
-                - [@Styles](ts-component-based-styles.md)
-        - About UI State Management
-            - [Basic Concepts](ts-ui-state-mgmt-concepts.md)
-            - Managing Component States
-                - [@State](ts-component-states-state.md)
-                - [@Prop](ts-component-states-prop.md)
-                - [@Link](ts-component-states-link.md)
-            - Managing Application States
-                - [AppStorage](ts-application-states-appstorage.md)
-                - [PersistentStorage](ts-application-states-apis-persistentstorage.md)
-                - [Environment](ts-application-states-apis-environment.md)
-            - Managing Other States
-                - [@Observed and @ObjectLink](ts-other-states-observed-objectlink.md)
-                - [@Consume and @Provide](ts-other-states-consume-provide.md)
-                - [@Watch](ts-other-states-watch.md)
-            - About Rendering Control Syntax
-                - [if/else](ts-rending-control-syntax-if-else.md)
-                - [ForEach](ts-rending-control-syntax-foreach.md)
-                - [LazyForEach](ts-rending-control-syntax-lazyforeach.md)
-        - About @Component
-            - [build Function](ts-function-build.md)
-            - [Initialization of Custom Components' Member Variables](ts-custom-component-initialization.md)
-            - [Custom Component Lifecycle Callbacks](ts-custom-component-lifecycle-callbacks.md)
-            - [Component Creation and Re-initialization](ts-component-creation-re-initialization.md)
-        - [About Syntactic Sugar](ts-syntactic-sugar.md)
-    - Common Component Development Guidelines
-        - [Button](ui-ts-basic-components-button.md)
-        - [Web](ui-ts-components-web.md)
-    - Common Layout Development Guidelines
-        - [Flex Layout](ui-ts-layout-flex.md)
-        - [Grid Layout](ui-ts-layout-grid-container.md)
-        - [Media Query](ui-ts-layout-mediaquery.md)
-    - Experiencing the Declarative UI
-        - [Creating a Declarative UI Project](ui-ts-creating-project.md)
-        - [Getting to Know Components](ui-ts-components.md)
-        - [Creating a Simple Page](ui-ts-creating-simple-page.md)
-    - Defining Page Layout and Connection
-        - [Building a Food Data Model](ui-ts-building-data-model.md)
-        - [Building a Food Category List Layout](ui-ts-building-category-list-layout.md)
-        - [Building a Food Category Grid Layout](ui-ts-building-category-grid-layout.md)
-        - [Implementing Page Redirection and Data Transmission](ui-ts-page-redirection-data-transmission.md)
+
--- a/en/application-dev/website.md
+++ b/en/application-dev/website.md
--- a/zh-cn/application-dev/Readme-CN.md
+++ b/zh-cn/application-dev/Readme-CN.md
@@ -42,8 +42,8 @@
    - [示例代码](https://gitee.com/openharmony/app_samples/blob/master/README_zh.md)
    - [Codelabs](https://gitee.com/openharmony/codelabs/blob/master/README.md)
 - API参考
-    - [组件参考（基于JS扩展的类Web开发范式）](reference/arkui-js/Readme-CN.md)
    - [组件参考（基于TS扩展的声明式开发范式）](reference/arkui-ts/Readme-CN.md)
+    - [组件参考（基于JS扩展的类Web开发范式）](reference/arkui-js/Readme-CN.md)
    - 接口
      -   [JS及TS API参考](reference/apis/Readme-CN.md)
      -   Native API

--- a/zh-cn/application-dev/application-dev-guide-for-gitee.md
+++ b/zh-cn/application-dev/application-dev-guide-for-gitee.md
@@ -54,11 +54,14 @@ DevEco Studio工具是OpenHarmony应用开发的推荐IDE工具。
 API参考提供了OpenHarmony全量组件和接口的参考文档，可以帮助开发者快速查找到指定接口的详细描述和调用方法。

 内容包括：
- [组件参考（基于JS扩展的类Web开发范式）](reference/arkui-js/Readme-CN.md)
+
 - [组件参考（基于TS扩展的声明式开发范式）](reference/arkui-ts/Readme-CN.md)
-   接口参考
+
+
+- [组件参考（基于JS扩展的类Web开发范式）](reference/arkui-js/Readme-CN.md)
+- 接口参考
    - [JS及TS API参考](reference/apis/Readme-CN.md)
-    -  Native API
+    - Native API
        -   [Native API参考](reference/native-apis/Readme-CN.md)
        -   [标准库](reference/native-lib/third_party_libc/musl.md)
        -   [Node_API](reference/native-lib/third_party_napi/napi.md)

--- a/zh-cn/application-dev/reference/Readme-CN.md
+++ b/zh-cn/application-dev/reference/Readme-CN.md
 # 开发参考

-   [组件参考（基于JS扩展的类Web开发范式）](arkui-js/Readme-CN.md)
 -   [组件参考（基于TS扩展的声明式开发范式）](arkui-ts/Readme-CN.md)
+-   [组件参考（基于JS扩展的类Web开发范式）](arkui-js/Readme-CN.md)
 -   [接口参考（JS及TS API）](apis/Readme-CN.md)
 -   接口参考（Native API）
    -   [OpenHarmony Native API](./native-apis/Readme-CN.md)

--- a/zh-cn/application-dev/ui/Readme-CN.md
+++ b/zh-cn/application-dev/ui/Readme-CN.md
 # UI开发

 - [方舟开发框架（ArkUI）概述](arkui-overview.md)
- 基于JS扩展的类Web开发范式
-    - [概述](ui-js-overview.md)
-    - 框架说明
-        - [文件组织](js-framework-file.md)
-        - [js标签配置](js-framework-js-tag.md)
-        - [app.js](js-framework-js-file.md)
-        - 语法
-            - [HML语法参考](js-framework-syntax-hml.md)
-            - [CSS语法参考](js-framework-syntax-css.md)
-            - [JS语法参考](js-framework-syntax-js.md)
-        - [生命周期](js-framework-lifecycle.md)
-        - [资源限定与访问](js-framework-resource-restriction.md)
-        - [多语言支持](js-framework-multiple-languages.md)
-    - 构建用户界面
-        - [组件介绍](ui-js-building-ui-component.md)
-        - 构建布局
-            - [布局说明](ui-js-building-ui-layout-intro.md)
-            - [添加标题行和文本区域](ui-js-building-ui-layout-text.md)
-            - [添加图片区域](ui-js-building-ui-layout-image.md)
-            - [添加留言区域](ui-js-building-ui-layout-comment.md)
-            - [添加容器](ui-js-building-ui-layout-external-container.md)
-        - [添加交互](ui-js-building-ui-interactions.md)
-        - [动画](ui-js-building-ui-animation.md)
-        - [手势事件](ui-js-building-ui-event.md)
-        - [页面路由](ui-js-building-ui-routes.md)
-    - 常见组件开发指导
-        - 容器组件
-            - [List开发指导](ui-js-components-list.md)
-            - [Dialog开发指导](ui-js-components-dialog.md)
-            - [Form开发指导](ui-js-components-form.md)
-            - [Stepper开发指导](ui-js-components-stepper.md)
-            - [Tabs开发指导](ui-js-component-tabs.md)
-            - [Swiper开发指导](ui-js-components-swiper.md)
-        - 基础组件
-            - [Text开发指导](ui-js-components-text.md)
-            - [Input开发指导](ui-js-components-input.md)
-            - [Button开发指导](ui-js-components-button.md)
-            - [Picker开发指导](ui-js-components-picker.md)
-            - [Image开发指导](ui-js-components-images.md)
-            - [Image-animator开发指导](ui-js-components-image-animator.md)
-            - [Rating开发指导](ui-js-components-rating.md)
-            - [Slider开发指导](ui-js-components-slider.md)
-            - [Chart开发指导](ui-js-components-chart.md)
-            - [Switch开发指导](ui-js-components-switch.md)
-            - [Toolbar开发指导](ui-js-components-toolbar.md)
-            - [Menu开发指导](ui-js-components-menu.md)
-            - [Marquee开发指导](ui-js-components-marquee.md)
-            - [Qrcode开发指导](ui-js-components-qrcode.md)
-            - [Search开发指导](ui-js-components-search.md)
-        - Canvas开发指导
-            - [Canvas对象](ui-js-components-canvas.md)
-            - [CanvasRenderingContext2D对象](ui-js-components-canvasrenderingcontext2d.md)
-            - [Path2D对象](ui-js-components-path2d.md)
-            - [OffscreenCanvas对象](ui-js-components-offscreencanvas.md)
-        - [栅格布局](ui-js-components-grid.md)
-        - Svg开发指导
-            - [基础知识](ui-js-components-svg-overview.md)
-            - [绘制图形](ui-js-components-svg-graphics.md)
-            - [绘制路径](ui-js-components-svg-path.md)
-            - [绘制文本](ui-js-components-svg-text.md)
-    - 动效开发指导
-        - CSS动画
-            - [属性样式动画](ui-js-animate-attribute-style.md)
-            - [transform样式动画](ui-js-animate-transform.md)
-            - [background-position样式动画](ui-js-animate-background-position-style.md)
-            - [svg动画](ui-js-animate-svg.md)
-        - JS动画
-            - [组件动画](ui-js-animate-component.md)
-            - 插值器动画
-                - [动画动效](ui-js-animate-dynamic-effects.md)
-                - [动画帧](ui-js-animate-frame.md)
-    - [自定义组件](ui-js-custom-components.md)
 - 基于TS扩展的声明式开发范式
    - [概述](ui-ts-overview.md)
    - 框架说明
@@ -144,3 +72,76 @@
        - [构建食物列表List布局](ui-ts-building-category-list-layout.md)
        - [构建食物分类Grid布局](ui-ts-building-category-grid-layout.md)
        - [页面跳转与数据传递](ui-ts-page-redirection-data-transmission.md)
+
+- 基于JS扩展的类Web开发范式
+    - [概述](ui-js-overview.md)
+    - 框架说明
+        - [文件组织](js-framework-file.md)
+        - [js标签配置](js-framework-js-tag.md)
+        - [app.js](js-framework-js-file.md)
+        - 语法
+            - [HML语法参考](js-framework-syntax-hml.md)
+            - [CSS语法参考](js-framework-syntax-css.md)
+            - [JS语法参考](js-framework-syntax-js.md)
+        - [生命周期](js-framework-lifecycle.md)
+        - [资源限定与访问](js-framework-resource-restriction.md)
+        - [多语言支持](js-framework-multiple-languages.md)
+    - 构建用户界面
+        - [组件介绍](ui-js-building-ui-component.md)
+        - 构建布局
+            - [布局说明](ui-js-building-ui-layout-intro.md)
+            - [添加标题行和文本区域](ui-js-building-ui-layout-text.md)
+            - [添加图片区域](ui-js-building-ui-layout-image.md)
+            - [添加留言区域](ui-js-building-ui-layout-comment.md)
+            - [添加容器](ui-js-building-ui-layout-external-container.md)
+        - [添加交互](ui-js-building-ui-interactions.md)
+        - [动画](ui-js-building-ui-animation.md)
+        - [手势事件](ui-js-building-ui-event.md)
+        - [页面路由](ui-js-building-ui-routes.md)
+    - 常见组件开发指导
+        - 容器组件
+            - [List开发指导](ui-js-components-list.md)
+            - [Dialog开发指导](ui-js-components-dialog.md)
+            - [Form开发指导](ui-js-components-form.md)
+            - [Stepper开发指导](ui-js-components-stepper.md)
+            - [Tabs开发指导](ui-js-component-tabs.md)
+            - [Swiper开发指导](ui-js-components-swiper.md)
+        - 基础组件
+            - [Text开发指导](ui-js-components-text.md)
+            - [Input开发指导](ui-js-components-input.md)
+            - [Button开发指导](ui-js-components-button.md)
+            - [Picker开发指导](ui-js-components-picker.md)
+            - [Image开发指导](ui-js-components-images.md)
+            - [Image-animator开发指导](ui-js-components-image-animator.md)
+            - [Rating开发指导](ui-js-components-rating.md)
+            - [Slider开发指导](ui-js-components-slider.md)
+            - [Chart开发指导](ui-js-components-chart.md)
+            - [Switch开发指导](ui-js-components-switch.md)
+            - [Toolbar开发指导](ui-js-components-toolbar.md)
+            - [Menu开发指导](ui-js-components-menu.md)
+            - [Marquee开发指导](ui-js-components-marquee.md)
+            - [Qrcode开发指导](ui-js-components-qrcode.md)
+            - [Search开发指导](ui-js-components-search.md)
+        - Canvas开发指导
+            - [Canvas对象](ui-js-components-canvas.md)
+            - [CanvasRenderingContext2D对象](ui-js-components-canvasrenderingcontext2d.md)
+            - [Path2D对象](ui-js-components-path2d.md)
+            - [OffscreenCanvas对象](ui-js-components-offscreencanvas.md)
+        - [栅格布局](ui-js-components-grid.md)
+        - Svg开发指导
+            - [基础知识](ui-js-components-svg-overview.md)
+            - [绘制图形](ui-js-components-svg-graphics.md)
+            - [绘制路径](ui-js-components-svg-path.md)
+            - [绘制文本](ui-js-components-svg-text.md)
+    - 动效开发指导
+        - CSS动画
+            - [属性样式动画](ui-js-animate-attribute-style.md)
+            - [transform样式动画](ui-js-animate-transform.md)
+            - [background-position样式动画](ui-js-animate-background-position-style.md)
+            - [svg动画](ui-js-animate-svg.md)
+        - JS动画
+            - [组件动画](ui-js-animate-component.md)
+            - 插值器动画
+                - [动画动效](ui-js-animate-dynamic-effects.md)
+                - [动画帧](ui-js-animate-frame.md)
+    - [自定义组件](ui-js-custom-components.md)
\ No newline at end of file
--- a/zh-cn/application-dev/ui/arkui-overview.md
+++ b/zh-cn/application-dev/ui/arkui-overview.md
@@ -26,12 +26,12 @@

 - 平台API通道：方舟开发框架提供了API扩展机制，平台能力通过此种机制进行封装，提供风格统一的JS接口。

- 两种开发范式：方舟开发框架针对不同目的和技术背景的开发者提供了两种开发范式，分别是基于JS扩展的类Web开发范式（简称“类Web开发范式”）和基于TS扩展的声明式开发范式（简称“声明式开发范式”）。
+- 两种开发范式：方舟开发框架针对不同目的和技术背景的开发者提供了两种开发范式，分别是基于TS扩展的声明式开发范式（简称“声明式开发范式”）和基于JS扩展的类Web开发范式（简称“类Web开发范式”）。

  | 开发范式名称   | 简介                                       | 适用场景             | 适用人群                |
  | -------- | ---------------------------------------- | ---------------- | ------------------- |
-  | 类Web开发范式 | 采用经典的HML、CSS、JavaScript三段式开发方式。使用HML标签文件进行布局搭建，使用CSS文件进行样式描述，使用JavaScript文件进行逻辑处理。UI组件与数据之间通过单向数据绑定的方式建立关联，当数据发生变化时，UI界面自动触发更新。此种开发方式，更接近Web前端开发者的使用习惯，快速将已有的Web应用改造成方舟开发框架应用。 | 界面较为简单的中小型应用和卡片  | Web前端开发人员           |
  | 声明式开发范式  | 采用TS语言并进行声明式UI语法扩展，从组件、动效和状态管理三个维度提供了UI绘制能力。UI开发更接近自然语义的编程方式，让开发者直观地描述UI界面，不必关心框架如何实现UI绘制和渲染，实现极简高效开发。同时，选用有类型标注的TS语言，引入编译期的类型校验。 | 复杂度较大、团队合作度较高的程序 | 移动系统应用开发人员、系统应用开发人员 |
+  | 类Web开发范式 | 采用经典的HML、CSS、JavaScript三段式开发方式。使用HML标签文件进行布局搭建，使用CSS文件进行样式描述，使用JavaScript文件进行逻辑处理。UI组件与数据之间通过单向数据绑定的方式建立关联，当数据发生变化时，UI界面自动触发更新。此种开发方式，更接近Web前端开发者的使用习惯，快速将已有的Web应用改造成方舟开发框架应用。 | 界面较为简单的中小型应用和卡片  | Web前端开发人员           |




--- a/zh-cn/application-dev/website.md
+++ b/zh-cn/application-dev/website.md