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 (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)
+
+-   [Component Reference (JavaScript-based Web-like Development Paradigm)](reference/arkui-js/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)

--- 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
@@ -36,6 +36,77 @@
      - [Test Framework Usage](ability/ability-delegator.md)
  - UI Development
    - [ArkUI Overview](ui/arkui-overview.md)
+    - TypeScript-based Declarative Development Paradigm
+      - [Overview](ui/ui-ts-overview.md)
+      - Framework Overview
+        - File Organization
+          - [Directory Structure](ui/ts-framework-directory.md)
+          - [Rules for Accessing Application Code Files](ui/ts-framework-file-access-rules.md)
+        - ["js" Tag](ui/ts-framework-js-tag.md)
+        - Resource Management
+          - [Resource File Categories](ui/ui-ts-basic-resource-file-categories.md)
+          - [Accessing Resources](ui/ts-resource-access.md)
+        - [Pixel Units](ui/ts-pixel-units.md)
+        - [Types](ui/ts-types.md)
+      - Declarative Syntax
+        - [Overview](ui/ts-syntax-intro.md)
+        - General UI Description Specifications
+          - [Basic Concepts](ui/ts-general-ui-concepts.md)
+          - Declarative UI Description Specifications
+            - [Configuration Without Parameters](ui/ts-parameterless-configuration.md)
+            - [Configuration with Mandatory Parameters](ui/ts-configuration-with-mandatory-parameters.md)
+            - [Attribute Configuration](ui/ts-attribution-configuration.md)
+            - [Event Configuration](ui/ts-event-configuration.md)
+            - [Child Component Configuration](ui/ts-child-component-configuration.md)
+          - Componentization
+            - [@Component](ui/ts-component-based-component.md)
+            - [@Entry](ui/ts-component-based-entry.md)
+            - [@Preview](ui/ts-component-based-preview.md)
+            - [@Builder](ui/ts-component-based-builder.md)
+            - [@Extend](ui/ts-component-based-extend.md)
+            - [@CustomDialog](ui/ts-component-based-customdialog.md)
+            - [@Styles](ui/ts-component-based-styles.md)
+        - About UI State Management
+          - [Basic Concepts](ui/ts-ui-state-mgmt-concepts.md)
+          - Managing Component States
+            - [@State](ui/ts-component-states-state.md)
+            - [@Prop](ui/ts-component-states-prop.md)
+            - [@Link](ui/ts-component-states-link.md)
+          - Managing Application States
+            - [AppStorage](ui/ts-application-states-appstorage.md)
+            - [LocalStorage](ui/ui-ts-local-storage.md)
+            - [PersistentStorage](ui/ts-application-states-apis-persistentstorage.md)
+            - [Environment](ui/ts-application-states-apis-environment.md)
+          - Managing Other States
+            - [@Observed and @ObjectLink](ui/ts-other-states-observed-objectlink.md)
+            - [@Consume and @Provide](ui/ts-other-states-consume-provide.md)
+            - [@Watch](ui/ts-other-states-watch.md)
+          - About Rendering Control Syntax
+            - [if/else](ui/ts-rending-control-syntax-if-else.md)
+            - [ForEach](ui/ts-rending-control-syntax-foreach.md)
+            - [LazyForEach](ui/ts-rending-control-syntax-lazyforeach.md)
+        - About @Component
+          - [build Function](ui/ts-function-build.md)
+          - [Initialization of Custom Components' Member Variables](ui/ts-custom-component-initialization.md)
+          - [Custom Component Lifecycle Callbacks](ui/ts-custom-component-lifecycle-callbacks.md)
+          - [Component Creation and Re-initialization](ui/ts-component-creation-re-initialization.md)
+        - [About Syntactic Sugar](ui/ts-syntactic-sugar.md)
+      - Common Component Development Guidelines
+        - [Button](ui/ui-ts-basic-components-button.md)
+        - [Web](ui/ui-ts-components-web.md)
+      - Common Layout Development Guidelines
+        - [Flex Layout](ui/ui-ts-layout-flex.md)
+        - [Grid Layout](ui/ui-ts-layout-grid-container.md)
+        - [Media Query](ui/ui-ts-layout-mediaquery.md)
+      - Experiencing the Declarative UI
+        - [Creating a Declarative UI Project](ui/ui-ts-creating-project.md)
+        - [Getting to Know Components](ui/ui-ts-components.md)
+        - [Creating a Simple Page](ui/ui-ts-creating-simple-page.md)
+      - Defining Page Layout and Connection
+        - [Building a Food Data Model](ui/ui-ts-building-data-model.md)
+        - [Building a Food Category List Layout](ui/ui-ts-building-category-list-layout.md)
+        - [Building a Food Category Grid Layout](ui/ui-ts-building-category-grid-layout.md)
+        - [Implementing Page Redirection and Data Transmission](ui/ui-ts-page-redirection-data-transmission.md)
    - JavaScript-based Web-like Development Paradigm
      - [Overview](ui/ui-js-overview.md)
      - Framework
@@ -108,77 +179,6 @@
            - [Animation Effect](ui/ui-js-animate-dynamic-effects.md)
            - [Animation Frame](ui/ui-js-animate-frame.md)
      - [Custom Components](ui/ui-js-custom-components.md)
-    - TypeScript-based Declarative Development Paradigm
-      - [Overview](ui/ui-ts-overview.md)
-      - Framework Overview
-        - File Organization
-          - [Directory Structure](ui/ts-framework-directory.md)
-          - [Rules for Accessing Application Code Files](ui/ts-framework-file-access-rules.md)
-        - ["js" Tag](ui/ts-framework-js-tag.md)
-        - Resource Management
-          - [Resource File Categories](ui/ui-ts-basic-resource-file-categories.md)
-          - [Accessing Resources](ui/ts-resource-access.md)
-        - [Pixel Units](ui/ts-pixel-units.md)
-        - [Types](ui/ts-types.md)
-      - Declarative Syntax
-        - [Overview](ui/ts-syntax-intro.md)
-        - General UI Description Specifications
-          - [Basic Concepts](ui/ts-general-ui-concepts.md)
-          - Declarative UI Description Specifications
-            - [Configuration Without Parameters](ui/ts-parameterless-configuration.md)
-            - [Configuration with Mandatory Parameters](ui/ts-configuration-with-mandatory-parameters.md)
-            - [Attribute Configuration](ui/ts-attribution-configuration.md)
-            - [Event Configuration](ui/ts-event-configuration.md)
-            - [Child Component Configuration](ui/ts-child-component-configuration.md)
-          - Componentization
-            - [@Component](ui/ts-component-based-component.md)
-            - [@Entry](ui/ts-component-based-entry.md)
-            - [@Preview](ui/ts-component-based-preview.md)
-            - [@Builder](ui/ts-component-based-builder.md)
-            - [@Extend](ui/ts-component-based-extend.md)
-            - [@CustomDialog](ui/ts-component-based-customdialog.md)
-            - [@Styles](ui/ts-component-based-styles.md)
-        - About UI State Management
-          - [Basic Concepts](ui/ts-ui-state-mgmt-concepts.md)
-          - Managing Component States
-            - [@State](ui/ts-component-states-state.md)
-            - [@Prop](ui/ts-component-states-prop.md)
-            - [@Link](ui/ts-component-states-link.md)
-          - Managing Application States
-            - [AppStorage](ui/ts-application-states-appstorage.md)
-            - [LocalStorage](ui/ui-ts-local-storage.md)
-            - [PersistentStorage](ui/ts-application-states-apis-persistentstorage.md)
-            - [Environment](ui/ts-application-states-apis-environment.md)
-          - Managing Other States
-            - [@Observed and @ObjectLink](ui/ts-other-states-observed-objectlink.md)
-            - [@Consume and @Provide](ui/ts-other-states-consume-provide.md)
-            - [@Watch](ui/ts-other-states-watch.md)
-          - About Rendering Control Syntax
-            - [if/else](ui/ts-rending-control-syntax-if-else.md)
-            - [ForEach](ui/ts-rending-control-syntax-foreach.md)
-            - [LazyForEach](ui/ts-rending-control-syntax-lazyforeach.md)
-        - About @Component
-          - [build Function](ui/ts-function-build.md)
-          - [Initialization of Custom Components' Member Variables](ui/ts-custom-component-initialization.md)
-          - [Custom Component Lifecycle Callbacks](ui/ts-custom-component-lifecycle-callbacks.md)
-          - [Component Creation and Re-initialization](ui/ts-component-creation-re-initialization.md)
-        - [About Syntactic Sugar](ui/ts-syntactic-sugar.md)
-      - Common Component Development Guidelines
-        - [Button](ui/ui-ts-basic-components-button.md)
-        - [Web](ui/ui-ts-components-web.md)
-      - Common Layout Development Guidelines
-        - [Flex Layout](ui/ui-ts-layout-flex.md)
-        - [Grid Layout](ui/ui-ts-layout-grid-container.md)
-        - [Media Query](ui/ui-ts-layout-mediaquery.md)
-      - Experiencing the Declarative UI
-        - [Creating a Declarative UI Project](ui/ui-ts-creating-project.md)
-        - [Getting to Know Components](ui/ui-ts-components.md)
-        - [Creating a Simple Page](ui/ui-ts-creating-simple-page.md)
-      - Defining Page Layout and Connection
-        - [Building a Food Data Model](ui/ui-ts-building-data-model.md)
-        - [Building a Food Category List Layout](ui/ui-ts-building-category-list-layout.md)
-        - [Building a Food Category Grid Layout](ui/ui-ts-building-category-grid-layout.md)
-        - [Implementing Page Redirection and Data Transmission](ui/ui-ts-page-redirection-data-transmission.md)
  - Common Event and Notification

    - [Common Event and Notification Overview](notification/notification-brief.md)
@@ -316,108 +316,6 @@
  - [Samples](https://gitee.com/openharmony/app_samples/blob/master/README.md)
  - [Codelabs](https://gitee.com/openharmony/codelabs)
 - API References
-  - Component Reference (JavaScript-based Web-like Development Paradigm)
-    - Universal Component Information
-      - [Universal Attributes](reference/arkui-js/js-components-common-attributes.md)
-      - [Universal Styles](reference/arkui-js/js-components-common-styles.md)
-      - [Universal Events](reference/arkui-js/js-components-common-events.md)
-      - [Universal Methods](reference/arkui-js/js-components-common-methods.md)
-      - [Animation Styles](reference/arkui-js/js-components-common-animation.md)
-      - [Gradient Styles](reference/arkui-js/js-components-common-gradient.md)
-      - [Transition Styles](reference/arkui-js/js-components-common-transition.md)
-      - [Media Query](reference/arkui-js/js-components-common-mediaquery.md)
-      - [Custom Font Styles](reference/arkui-js/js-components-common-customizing-font.md)
-      - [Atomic Layout](reference/arkui-js/js-components-common-atomic-layout.md)
-    - Container Component
-      - [badge](reference/arkui-js/js-components-container-badge.md)
-      - [dialog](reference/arkui-js/js-components-container-dialog.md)
-      - [div](reference/arkui-js/js-components-container-div.md)
-      - [form](reference/arkui-js/js-components-container-form.md)
-      - [list](reference/arkui-js/js-components-container-list.md)
-      - [list-item](reference/arkui-js/js-components-container-list-item.md)
-      - [list-item-group](reference/arkui-js/js-components-container-list-item-group.md)
-      - [panel](reference/arkui-js/js-components-container-panel.md)
-      - [popup](reference/arkui-js/js-components-container-popup.md)
-      - [refresh](reference/arkui-js/js-components-container-refresh.md)
-      - [stack](reference/arkui-js/js-components-container-stack.md)
-      - [stepper](reference/arkui-js/js-components-container-stepper.md)
-      - [stepper-item](reference/arkui-js/js-components-container-stepper-item.md)
-      - [swiper](reference/arkui-js/js-components-container-swiper.md)
-      - [tabs](reference/arkui-js/js-components-container-tabs.md)
-      - [tab-bar](reference/arkui-js/js-components-container-tab-bar.md)
-      - [tab-content](reference/arkui-js/js-components-container-tab-content.md)
-    - Basic Components
-      - [button](reference/arkui-js/js-components-basic-button.md)
-      - [chart](reference/arkui-js/js-components-basic-chart.md)
-      - [divider](reference/arkui-js/js-components-basic-divider.md)
-      - [image](reference/arkui-js/js-components-basic-image.md)
-      - [image-animator](reference/arkui-js/js-components-basic-image-animator.md)
-      - [input](reference/arkui-js/js-components-basic-input.md)
-      - [label](reference/arkui-js/js-components-basic-label.md)
-      - [marquee](reference/arkui-js/js-components-basic-marquee.md)
-      - [menu](reference/arkui-js/js-components-basic-menu.md)
-      - [option](reference/arkui-js/js-components-basic-option.md)
-      - [picker](reference/arkui-js/js-components-basic-picker.md)
-      - [picker-view](reference/arkui-js/js-components-basic-picker-view.md)
-      - [piece](reference/arkui-js/js-components-basic-piece.md)
-      - [progress](reference/arkui-js/js-components-basic-progress.md)
-      - [qrcode](reference/arkui-js/js-components-basic-qrcode.md)
-      - [rating](reference/arkui-js/js-components-basic-rating.md)
-      - [richtext](reference/arkui-js/js-components-basic-richtext.md)
-      - [search](reference/arkui-js/js-components-basic-search.md)
-      - [select](reference/arkui-js/js-components-basic-select.md)
-      - [slider](reference/arkui-js/js-components-basic-slider.md)
-      - [span](reference/arkui-js/js-components-basic-span.md)
-      - [switch](reference/arkui-js/js-components-basic-switch.md)
-      - [text](reference/arkui-js/js-components-basic-text.md)
-      - [textarea](reference/arkui-js/js-components-basic-textarea.md)
-      - [toolbar](reference/arkui-js/js-components-basic-toolbar.md)
-      - [toolbar-item](reference/arkui-js/js-components-basic-toolbar-item.md)
-      - [toggle](reference/arkui-js/js-components-basic-toggle.md)
-      - [web](reference/arkui-js/js-components-basic-web.md)
-      - [xcomponent](reference/arkui-js/js-components-basic-xcomponent.md)
-    - Media Components
-      - [video](reference/arkui-js/js-components-media-video.md)
-    - Canvas Components
-      - [canvas](reference/arkui-js/js-components-canvas-canvas.md)
-      - [CanvasRenderingContext2D](reference/arkui-js/js-components-canvas-canvasrenderingcontext2d.md)
-      - [Image](reference/arkui-js/js-components-canvas-image.md)
-      - [CanvasGradient](reference/arkui-js/js-components-canvas-canvasgradient.md)
-      - [ImageData](reference/arkui-js/js-components-canvas-imagedata.md)
-      - [Path2D](reference/arkui-js/js-components-canvas-path2d.md)
-      - [ImageBitmap](reference/arkui-js/js-components-canvas-imagebitmap.md)
-      - [OffscreenCanvas](reference/arkui-js/js-components-canvas-offscreencanvas.md)
-      - [OffscreenCanvasRenderingContext2D](reference/arkui-js/js-offscreencanvasrenderingcontext2d.md)
-    - Grid Components
-      - [Basic Concepts](reference/arkui-js/js-components-grid-basic-concepts.md)
-      - [grid-container](reference/arkui-js/js-components-grid-container.md)
-      - [grid-row](reference/arkui-js/js-components-grid-row.md)
-      - [grid-col](reference/arkui-js/js-components-grid-col.md)
-    - SVG Components
-      - [Universal Attributes](reference/arkui-js/js-components-svg-common-attributes.md)
-      - [svg](reference/arkui-js/js-components-svg.md)
-      - [rect](reference/arkui-js/js-components-svg-rect.md)
-      - [circle](reference/arkui-js/js-components-svg-circle.md)
-      - [ellipse](reference/arkui-js/js-components-svg-ellipse.md)
-      - [path](reference/arkui-js/js-components-svg-path.md)
-      - [line](reference/arkui-js/js-components-svg-line.md)
-      - [polyline](reference/arkui-js/js-components-svg-polyline.md)
-      - [polygon](reference/arkui-js/js-components-svg-polygon.md)
-      - [text](reference/arkui-js/js-components-svg-text.md)
-      - [tspan](reference/arkui-js/js-components-svg-tspan.md)
-      - [textPath](reference/arkui-js/js-components-svg-textpath.md)
-      - [animate](reference/arkui-js/js-components-svg-animate.md)
-      - [animateMotion](reference/arkui-js/js-components-svg-animatemotion.md)
-      - [animateTransform](reference/arkui-js/js-components-svg-animatetransform.md)
-    - Custom Components
-      - [Basic Usage](reference/arkui-js/js-components-custom-basic-usage.md)
-      - [Style Inheritance](reference/arkui-js/js-components-custom-style.md)
-      - [Custom Events](reference/arkui-js/js-components-custom-events.md)
-      - [props](reference/arkui-js/js-components-custom-props.md)
-      - [Event Parameter](reference/arkui-js/js-components-custom-event-parameter.md)
-      - [slot](reference/arkui-js/js-components-custom-slot.md)
-      - [Lifecycle Definition](reference/arkui-js/js-components-custom-lifecycle.md)
-    - [Data Type Attributes](reference/arkui-js/js-appendix-types.md)
  - Component Reference (TypeScript-based Declarative Development Paradigm)
    - Universal Component Information
      - Universal Events
@@ -571,6 +469,108 @@
        - [Text Picker Dialog Box](reference/arkui-ts/ts-methods-textpicker-dialog.md)
      - [Menu](reference/arkui-ts/ts-methods-menu.md)
    - [Built-in Enums](reference/arkui-ts/ts-appendix-enums.md)
+  - Component Reference (JavaScript-based Web-like Development Paradigm)
+    - Universal Component Information
+      - [Universal Attributes](reference/arkui-js/js-components-common-attributes.md)
+      - [Universal Styles](reference/arkui-js/js-components-common-styles.md)
+      - [Universal Events](reference/arkui-js/js-components-common-events.md)
+      - [Universal Methods](reference/arkui-js/js-components-common-methods.md)
+      - [Animation Styles](reference/arkui-js/js-components-common-animation.md)
+      - [Gradient Styles](reference/arkui-js/js-components-common-gradient.md)
+      - [Transition Styles](reference/arkui-js/js-components-common-transition.md)
+      - [Media Query](reference/arkui-js/js-components-common-mediaquery.md)
+      - [Custom Font Styles](reference/arkui-js/js-components-common-customizing-font.md)
+      - [Atomic Layout](reference/arkui-js/js-components-common-atomic-layout.md)
+    - Container Component
+      - [badge](reference/arkui-js/js-components-container-badge.md)
+      - [dialog](reference/arkui-js/js-components-container-dialog.md)
+      - [div](reference/arkui-js/js-components-container-div.md)
+      - [form](reference/arkui-js/js-components-container-form.md)
+      - [list](reference/arkui-js/js-components-container-list.md)
+      - [list-item](reference/arkui-js/js-components-container-list-item.md)
+      - [list-item-group](reference/arkui-js/js-components-container-list-item-group.md)
+      - [panel](reference/arkui-js/js-components-container-panel.md)
+      - [popup](reference/arkui-js/js-components-container-popup.md)
+      - [refresh](reference/arkui-js/js-components-container-refresh.md)
+      - [stack](reference/arkui-js/js-components-container-stack.md)
+      - [stepper](reference/arkui-js/js-components-container-stepper.md)
+      - [stepper-item](reference/arkui-js/js-components-container-stepper-item.md)
+      - [swiper](reference/arkui-js/js-components-container-swiper.md)
+      - [tabs](reference/arkui-js/js-components-container-tabs.md)
+      - [tab-bar](reference/arkui-js/js-components-container-tab-bar.md)
+      - [tab-content](reference/arkui-js/js-components-container-tab-content.md)
+    - Basic Components
+      - [button](reference/arkui-js/js-components-basic-button.md)
+      - [chart](reference/arkui-js/js-components-basic-chart.md)
+      - [divider](reference/arkui-js/js-components-basic-divider.md)
+      - [image](reference/arkui-js/js-components-basic-image.md)
+      - [image-animator](reference/arkui-js/js-components-basic-image-animator.md)
+      - [input](reference/arkui-js/js-components-basic-input.md)
+      - [label](reference/arkui-js/js-components-basic-label.md)
+      - [marquee](reference/arkui-js/js-components-basic-marquee.md)
+      - [menu](reference/arkui-js/js-components-basic-menu.md)
+      - [option](reference/arkui-js/js-components-basic-option.md)
+      - [picker](reference/arkui-js/js-components-basic-picker.md)
+      - [picker-view](reference/arkui-js/js-components-basic-picker-view.md)
+      - [piece](reference/arkui-js/js-components-basic-piece.md)
+      - [progress](reference/arkui-js/js-components-basic-progress.md)
+      - [qrcode](reference/arkui-js/js-components-basic-qrcode.md)
+      - [rating](reference/arkui-js/js-components-basic-rating.md)
+      - [richtext](reference/arkui-js/js-components-basic-richtext.md)
+      - [search](reference/arkui-js/js-components-basic-search.md)
+      - [select](reference/arkui-js/js-components-basic-select.md)
+      - [slider](reference/arkui-js/js-components-basic-slider.md)
+      - [span](reference/arkui-js/js-components-basic-span.md)
+      - [switch](reference/arkui-js/js-components-basic-switch.md)
+      - [text](reference/arkui-js/js-components-basic-text.md)
+      - [textarea](reference/arkui-js/js-components-basic-textarea.md)
+      - [toolbar](reference/arkui-js/js-components-basic-toolbar.md)
+      - [toolbar-item](reference/arkui-js/js-components-basic-toolbar-item.md)
+      - [toggle](reference/arkui-js/js-components-basic-toggle.md)
+      - [web](reference/arkui-js/js-components-basic-web.md)
+      - [xcomponent](reference/arkui-js/js-components-basic-xcomponent.md)
+    - Media Components
+      - [video](reference/arkui-js/js-components-media-video.md)
+    - Canvas Components
+      - [canvas](reference/arkui-js/js-components-canvas-canvas.md)
+      - [CanvasRenderingContext2D](reference/arkui-js/js-components-canvas-canvasrenderingcontext2d.md)
+      - [Image](reference/arkui-js/js-components-canvas-image.md)
+      - [CanvasGradient](reference/arkui-js/js-components-canvas-canvasgradient.md)
+      - [ImageData](reference/arkui-js/js-components-canvas-imagedata.md)
+      - [Path2D](reference/arkui-js/js-components-canvas-path2d.md)
+      - [ImageBitmap](reference/arkui-js/js-components-canvas-imagebitmap.md)
+      - [OffscreenCanvas](reference/arkui-js/js-components-canvas-offscreencanvas.md)
+      - [OffscreenCanvasRenderingContext2D](reference/arkui-js/js-offscreencanvasrenderingcontext2d.md)
+    - Grid Components
+      - [Basic Concepts](reference/arkui-js/js-components-grid-basic-concepts.md)
+      - [grid-container](reference/arkui-js/js-components-grid-container.md)
+      - [grid-row](reference/arkui-js/js-components-grid-row.md)
+      - [grid-col](reference/arkui-js/js-components-grid-col.md)
+    - SVG Components
+      - [Universal Attributes](reference/arkui-js/js-components-svg-common-attributes.md)
+      - [svg](reference/arkui-js/js-components-svg.md)
+      - [rect](reference/arkui-js/js-components-svg-rect.md)
+      - [circle](reference/arkui-js/js-components-svg-circle.md)
+      - [ellipse](reference/arkui-js/js-components-svg-ellipse.md)
+      - [path](reference/arkui-js/js-components-svg-path.md)
+      - [line](reference/arkui-js/js-components-svg-line.md)
+      - [polyline](reference/arkui-js/js-components-svg-polyline.md)
+      - [polygon](reference/arkui-js/js-components-svg-polygon.md)
+      - [text](reference/arkui-js/js-components-svg-text.md)
+      - [tspan](reference/arkui-js/js-components-svg-tspan.md)
+      - [textPath](reference/arkui-js/js-components-svg-textpath.md)
+      - [animate](reference/arkui-js/js-components-svg-animate.md)
+      - [animateMotion](reference/arkui-js/js-components-svg-animatemotion.md)
+      - [animateTransform](reference/arkui-js/js-components-svg-animatetransform.md)
+    - Custom Components
+      - [Basic Usage](reference/arkui-js/js-components-custom-basic-usage.md)
+      - [Style Inheritance](reference/arkui-js/js-components-custom-style.md)
+      - [Custom Events](reference/arkui-js/js-components-custom-events.md)
+      - [props](reference/arkui-js/js-components-custom-props.md)
+      - [Event Parameter](reference/arkui-js/js-components-custom-event-parameter.md)
+      - [slot](reference/arkui-js/js-components-custom-slot.md)
+      - [Lifecycle Definition](reference/arkui-js/js-components-custom-lifecycle.md)
+    - [Data Type Attributes](reference/arkui-js/js-appendix-types.md)
  - APIs
    - [API Reference Document Description](reference/apis/development-intro.md)
    - Ability Framework

--- 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,8 +54,11 @@ 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

--- 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)
+- 基于TS扩展的声明式开发范式
+    - [概述](ui-ts-overview.md)
+    - 框架说明
+        - 文件组织
+            - [目录结构](ts-framework-directory.md)
+            - [应用代码文件访问规则](ts-framework-file-access-rules.md)
+        - [js标签配置](ts-framework-js-tag.md)
+        - 资源管理
+            - [资源文件的分类](ui-ts-basic-resource-file-categories.md)
+            - [资源访问](ts-resource-access.md)
+        - [像素单位](ts-pixel-units.md)
+        - [类型定义](ts-types.md)
+    - 声明式语法
+        - [描述规范使用说明](ts-syntax-intro.md)
+        - 通用UI描述规范
+            - [基本概念](ts-general-ui-concepts.md)
+            - 声明式UI描述规范
+                - [无构造参数配置](ts-parameterless-configuration.md)
+                - [必选参数构造配置](ts-configuration-with-mandatory-parameters.md)
+                - [属性配置](ts-attribution-configuration.md)
+                - [事件配置](ts-event-configuration.md)
+                - [子组件配置](ts-child-component-configuration.md)
+            - 组件化
+                - [@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)
+        - UI状态管理
+            - [基本概念](ts-ui-state-mgmt-concepts.md)
+            - 管理组件拥有的状态
+                - [@State](ts-component-states-state.md)
+                - [@Prop](ts-component-states-prop.md)
+                - [@Link](ts-component-states-link.md)
+            - 管理应用程序的状态
+                - [应用程序的数据存储](ts-application-states-appstorage.md)
+                - [Ability数据存储](ui-ts-local-storage.md)
+                - [持久化数据管理](ts-application-states-apis-persistentstorage.md)
+                - [环境变量](ts-application-states-apis-environment.md)
+            - 其他类目的状态管理
+                - [Observed和ObjectLink数据管理](ts-other-states-observed-objectlink.md)
+                - [@Consume和@Provide数据管理](ts-other-states-consume-provide.md)
+                - [@Watch](ts-other-states-watch.md)
+        - 渲染控制语法
+            - [条件渲染](ts-rending-control-syntax-if-else.md)
+            - [循环渲染](ts-rending-control-syntax-foreach.md)
+            - [数据懒加载](ts-rending-control-syntax-lazyforeach.md)
+        - 深入理解组件化
+            - [build函数](ts-function-build.md)
+            - [自定义组件初始化](ts-custom-component-initialization.md)
+            - [自定义组件生命周期回调函数](ts-custom-component-lifecycle-callbacks.md)
+            - [组件创建和重新初始化示例](ts-component-creation-re-initialization.md)
+        - [语法糖](ts-syntactic-sugar.md)
+    - 常见组件开发指导
+        - [Button开发指导](ui-ts-basic-components-button.md)
+        - [Web开发指导](ui-ts-components-web.md)
+    - 常见布局开发指导
+        - [弹性布局](ui-ts-layout-flex.md)
+        - [栅格布局](ui-ts-layout-grid-container.md)
+        - [媒体查询](ui-ts-layout-mediaquery.md)
+    - 体验声明式UI
+        - [创建声明式UI工程](ui-ts-creating-project.md)
+        - [初识Component](ui-ts-components.md)
+        - [创建简单视图](ui-ts-creating-simple-page.md)
+    - 页面布局与连接
+        - [构建食物数据模型](ui-ts-building-data-model.md)
+        - [构建食物列表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)
    - 框架说明
@@ -73,74 +145,3 @@
                - [动画动效](ui-js-animate-dynamic-effects.md)
                - [动画帧](ui-js-animate-frame.md)
    - [自定义组件](ui-js-custom-components.md)
\ No newline at end of file
- 基于TS扩展的声明式开发范式
-    - [概述](ui-ts-overview.md)
-    - 框架说明
-        - 文件组织
-            - [目录结构](ts-framework-directory.md)
-            - [应用代码文件访问规则](ts-framework-file-access-rules.md)
-        - [js标签配置](ts-framework-js-tag.md)
-        - 资源管理
-            - [资源文件的分类](ui-ts-basic-resource-file-categories.md)
-            - [资源访问](ts-resource-access.md)
-        - [像素单位](ts-pixel-units.md)
-        - [类型定义](ts-types.md)
-    - 声明式语法
-        - [描述规范使用说明](ts-syntax-intro.md)
-        - 通用UI描述规范
-            - [基本概念](ts-general-ui-concepts.md)
-            - 声明式UI描述规范
-                - [无构造参数配置](ts-parameterless-configuration.md)
-                - [必选参数构造配置](ts-configuration-with-mandatory-parameters.md)
-                - [属性配置](ts-attribution-configuration.md)
-                - [事件配置](ts-event-configuration.md)
-                - [子组件配置](ts-child-component-configuration.md)
-            - 组件化
-                - [@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)
-        - UI状态管理
-            - [基本概念](ts-ui-state-mgmt-concepts.md)
-            - 管理组件拥有的状态
-                - [@State](ts-component-states-state.md)
-                - [@Prop](ts-component-states-prop.md)
-                - [@Link](ts-component-states-link.md)
-            - 管理应用程序的状态
-                - [应用程序的数据存储](ts-application-states-appstorage.md)
-                - [Ability数据存储](ui-ts-local-storage.md)
-                - [持久化数据管理](ts-application-states-apis-persistentstorage.md)
-                - [环境变量](ts-application-states-apis-environment.md)
-            - 其他类目的状态管理
-                - [Observed和ObjectLink数据管理](ts-other-states-observed-objectlink.md)
-                - [@Consume和@Provide数据管理](ts-other-states-consume-provide.md)
-                - [@Watch](ts-other-states-watch.md)
-        - 渲染控制语法
-            - [条件渲染](ts-rending-control-syntax-if-else.md)
-            - [循环渲染](ts-rending-control-syntax-foreach.md)
-            - [数据懒加载](ts-rending-control-syntax-lazyforeach.md)
-        - 深入理解组件化
-            - [build函数](ts-function-build.md)
-            - [自定义组件初始化](ts-custom-component-initialization.md)
-            - [自定义组件生命周期回调函数](ts-custom-component-lifecycle-callbacks.md)
-            - [组件创建和重新初始化示例](ts-component-creation-re-initialization.md)
-        - [语法糖](ts-syntactic-sugar.md)
-    - 常见组件开发指导
-        - [Button开发指导](ui-ts-basic-components-button.md)
-        - [Web开发指导](ui-ts-components-web.md)
-    - 常见布局开发指导
-        - [弹性布局](ui-ts-layout-flex.md)
-        - [栅格布局](ui-ts-layout-grid-container.md)
-        - [媒体查询](ui-ts-layout-mediaquery.md)
-    - 体验声明式UI
-        - [创建声明式UI工程](ui-ts-creating-project.md)
-        - [初识Component](ui-ts-components.md)
-        - [创建简单视图](ui-ts-creating-simple-page.md)
-    - 页面布局与连接
-        - [构建食物数据模型](ui-ts-building-data-model.md)
-        - [构建食物列表List布局](ui-ts-building-category-list-layout.md)
-        - [构建食物分类Grid布局](ui-ts-building-category-grid-layout.md)
-        - [页面跳转与数据传递](ui-ts-page-redirection-data-transmission.md)
--- 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
@@ -37,6 +37,77 @@
      - [测试框架使用指导](ability/ability-delegator.md)
  - UI开发
    - [方舟开发框架（ArkUI）概述](ui/arkui-overview.md)
+    - 基于TS扩展的声明式开发范式
+      - [概述](ui/ui-ts-overview.md)
+      - 框架说明
+        - 文件组织
+          - [目录结构](ui/ts-framework-directory.md)
+          - [应用代码文件访问规则](ui/ts-framework-file-access-rules.md)
+        - [js标签配置](ui/ts-framework-js-tag.md)
+        - 资源管理
+          - [资源文件的分类](ui/ui-ts-basic-resource-file-categories.md)
+          - [资源访问](ui/ts-resource-access.md)
+        - [像素单位](ui/ts-pixel-units.md)
+        - [类型定义](ui/ts-types.md)
+      - 声明式语法
+        - [描述规范使用说明](ui/ts-syntax-intro.md)
+        - 通用UI描述规范
+          - [基本概念](ui/ts-general-ui-concepts.md)
+          - 声明式UI描述规范
+            - [无构造参数配置](ui/ts-parameterless-configuration.md)
+            - [必选参数构造配置](ui/ts-configuration-with-mandatory-parameters.md)
+            - [属性配置](ui/ts-attribution-configuration.md)
+            - [事件配置](ui/ts-event-configuration.md)
+            - [子组件配置](ui/ts-child-component-configuration.md)
+          - 组件化
+            - [@Component](ui/ts-component-based-component.md)
+            - [@Entry](ui/ts-component-based-entry.md)
+            - [@Preview](ui/ts-component-based-preview.md)
+            - [@Builder](ui/ts-component-based-builder.md)
+            - [@Extend](ui/ts-component-based-extend.md)
+            - [@CustomDialog](ui/ts-component-based-customdialog.md)
+            - [@Styles](ui/ts-component-based-styles.md)
+        - UI状态管理
+          - [基本概念](ui/ts-ui-state-mgmt-concepts.md)
+          - 管理组件拥有的状态
+            - [@State](ui/ts-component-states-state.md)
+            - [@Prop](ui/ts-component-states-prop.md)
+            - [@Link](ui/ts-component-states-link.md)
+          - 管理应用程序的状态
+            - [应用程序的数据存储](ui/ts-application-states-appstorage.md)
+            - [Ability数据存储](ui/ui-ts-local-storage.md)
+            - [持久化数据管理](ui/ts-application-states-apis-persistentstorage.md)
+            - [环境变量](ui/ts-application-states-apis-environment.md)
+          - 其他类目的状态管理
+            - [Observed和ObjectLink数据管理](ui/ts-other-states-observed-objectlink.md)
+            - [@Consume和@Provide数据管理](ui/ts-other-states-consume-provide.md)
+            - [@Watch](ui/ts-other-states-watch.md)
+        - 渲染控制语法
+          - [条件渲染](ui/ts-rending-control-syntax-if-else.md)
+          - [循环渲染](ui/ts-rending-control-syntax-foreach.md)
+          - [数据懒加载](ui/ts-rending-control-syntax-lazyforeach.md)
+        - 深入理解组件化
+          - [build函数](ui/ts-function-build.md)
+          - [自定义组件初始化](ui/ts-custom-component-initialization.md)
+          - [自定义组件生命周期回调函数](ui/ts-custom-component-lifecycle-callbacks.md)
+          - [组件创建和重新初始化示例](ui/ts-component-creation-re-initialization.md)
+        - [语法糖](ui/ts-syntactic-sugar.md)
+      - 常见组件开发指导
+        - [Button开发指导](ui/ui-ts-basic-components-button.md)
+        - [Web开发指导](ui/ui-ts-components-web.md)
+      - 常见布局开发指导
+        - [弹性布局](ui/ui-ts-layout-flex.md)
+        - [栅格布局](ui/ui-ts-layout-grid-container.md)
+        - [媒体查询](ui/ui-ts-layout-mediaquery.md)
+      - 体验声明式UI
+        - [创建声明式UI工程](ui/ui-ts-creating-project.md)
+        - [初识Component](ui/ui-ts-components.md)
+        - [创建简单视图](ui/ui-ts-creating-simple-page.md)
+      - 页面布局与连接
+        - [构建食物数据模型](ui/ui-ts-building-data-model.md)
+        - [构建食物列表List布局](ui/ui-ts-building-category-list-layout.md)
+        - [构建食物分类Grid布局](ui/ui-ts-building-category-grid-layout.md)
+        - [页面跳转与数据传递](ui/ui-ts-page-redirection-data-transmission.md)
    - 基于JS扩展的类Web开发范式
      - [概述](ui/ui-js-overview.md)
      - 框架说明
@@ -109,77 +180,6 @@
            - [动画动效](ui/ui-js-animate-dynamic-effects.md)
            - [动画帧](ui/ui-js-animate-frame.md)
      - [自定义组件](ui/ui-js-custom-components.md)
-    - 基于TS扩展的声明式开发范式
-      - [概述](ui/ui-ts-overview.md)
-      - 框架说明
-        - 文件组织
-          - [目录结构](ui/ts-framework-directory.md)
-          - [应用代码文件访问规则](ui/ts-framework-file-access-rules.md)
-        - [js标签配置](ui/ts-framework-js-tag.md)
-        - 资源管理
-          - [资源文件的分类](ui/ui-ts-basic-resource-file-categories.md)
-          - [资源访问](ui/ts-resource-access.md)
-        - [像素单位](ui/ts-pixel-units.md)
-        - [类型定义](ui/ts-types.md)
-      - 声明式语法
-        - [描述规范使用说明](ui/ts-syntax-intro.md)
-        - 通用UI描述规范
-          - [基本概念](ui/ts-general-ui-concepts.md)
-          - 声明式UI描述规范
-            - [无构造参数配置](ui/ts-parameterless-configuration.md)
-            - [必选参数构造配置](ui/ts-configuration-with-mandatory-parameters.md)
-            - [属性配置](ui/ts-attribution-configuration.md)
-            - [事件配置](ui/ts-event-configuration.md)
-            - [子组件配置](ui/ts-child-component-configuration.md)
-          - 组件化
-            - [@Component](ui/ts-component-based-component.md)
-            - [@Entry](ui/ts-component-based-entry.md)
-            - [@Preview](ui/ts-component-based-preview.md)
-            - [@Builder](ui/ts-component-based-builder.md)
-            - [@Extend](ui/ts-component-based-extend.md)
-            - [@CustomDialog](ui/ts-component-based-customdialog.md)
-            - [@Styles](ui/ts-component-based-styles.md)
-        - UI状态管理
-          - [基本概念](ui/ts-ui-state-mgmt-concepts.md)
-          - 管理组件拥有的状态
-            - [@State](ui/ts-component-states-state.md)
-            - [@Prop](ui/ts-component-states-prop.md)
-            - [@Link](ui/ts-component-states-link.md)
-          - 管理应用程序的状态
-            - [应用程序的数据存储](ui/ts-application-states-appstorage.md)
-            - [Ability数据存储](ui/ui-ts-local-storage.md)
-            - [持久化数据管理](ui/ts-application-states-apis-persistentstorage.md)
-            - [环境变量](ui/ts-application-states-apis-environment.md)
-          - 其他类目的状态管理
-            - [Observed和ObjectLink数据管理](ui/ts-other-states-observed-objectlink.md)
-            - [@Consume和@Provide数据管理](ui/ts-other-states-consume-provide.md)
-            - [@Watch](ui/ts-other-states-watch.md)
-        - 渲染控制语法
-          - [条件渲染](ui/ts-rending-control-syntax-if-else.md)
-          - [循环渲染](ui/ts-rending-control-syntax-foreach.md)
-          - [数据懒加载](ui/ts-rending-control-syntax-lazyforeach.md)
-        - 深入理解组件化
-          - [build函数](ui/ts-function-build.md)
-          - [自定义组件初始化](ui/ts-custom-component-initialization.md)
-          - [自定义组件生命周期回调函数](ui/ts-custom-component-lifecycle-callbacks.md)
-          - [组件创建和重新初始化示例](ui/ts-component-creation-re-initialization.md)
-        - [语法糖](ui/ts-syntactic-sugar.md)
-      - 常见组件开发指导
-        - [Button开发指导](ui/ui-ts-basic-components-button.md)
-        - [Web开发指导](ui/ui-ts-components-web.md)
-      - 常见布局开发指导
-        - [弹性布局](ui/ui-ts-layout-flex.md)
-        - [栅格布局](ui/ui-ts-layout-grid-container.md)
-        - [媒体查询](ui/ui-ts-layout-mediaquery.md)
-      - 体验声明式UI
-        - [创建声明式UI工程](ui/ui-ts-creating-project.md)
-        - [初识Component](ui/ui-ts-components.md)
-        - [创建简单视图](ui/ui-ts-creating-simple-page.md)
-      - 页面布局与连接
-        - [构建食物数据模型](ui/ui-ts-building-data-model.md)
-        - [构建食物列表List布局](ui/ui-ts-building-category-list-layout.md)
-        - [构建食物分类Grid布局](ui/ui-ts-building-category-grid-layout.md)
-        - [页面跳转与数据传递](ui/ui-ts-page-redirection-data-transmission.md)
  - 公共事件与通知
    - [公共事件与通知概述](notification/notification-brief.md)
    - [公共事件开发指导](notification/common-event.md)
@@ -377,108 +377,6 @@
  - [示例代码](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/js-components-common-attributes.md)
-      - [通用样式](reference/arkui-js/js-components-common-styles.md)
-      - [通用事件](reference/arkui-js/js-components-common-events.md)
-      - [通用方法](reference/arkui-js/js-components-common-methods.md)
-      - [动画样式](reference/arkui-js/js-components-common-animation.md)
-      - [渐变样式](reference/arkui-js/js-components-common-gradient.md)
-      - [转场样式](reference/arkui-js/js-components-common-transition.md)
-      - [媒体查询](reference/arkui-js/js-components-common-mediaquery.md)
-      - [自定义字体样式](reference/arkui-js/js-components-common-customizing-font.md)
-      - [原子布局](reference/arkui-js/js-components-common-atomic-layout.md)
-    - 容器组件
-      - [badge](reference/arkui-js/js-components-container-badge.md)
-      - [dialog](reference/arkui-js/js-components-container-dialog.md)
-      - [div](reference/arkui-js/js-components-container-div.md)
-      - [form](reference/arkui-js/js-components-container-form.md)
-      - [list](reference/arkui-js/js-components-container-list.md)
-      - [list-item](reference/arkui-js/js-components-container-list-item.md)
-      - [list-item-group](reference/arkui-js/js-components-container-list-item-group.md)
-      - [panel](reference/arkui-js/js-components-container-panel.md)
-      - [popup](reference/arkui-js/js-components-container-popup.md)
-      - [refresh](reference/arkui-js/js-components-container-refresh.md)
-      - [stack](reference/arkui-js/js-components-container-stack.md)
-      - [stepper](reference/arkui-js/js-components-container-stepper.md)
-      - [stepper-item](reference/arkui-js/js-components-container-stepper-item.md)
-      - [swiper](reference/arkui-js/js-components-container-swiper.md)
-      - [tabs](reference/arkui-js/js-components-container-tabs.md)
-      - [tab-bar](reference/arkui-js/js-components-container-tab-bar.md)
-      - [tab-content](reference/arkui-js/js-components-container-tab-content.md)
-    - 基础组件
-      - [button](reference/arkui-js/js-components-basic-button.md)
-      - [chart](reference/arkui-js/js-components-basic-chart.md)
-      - [divider](reference/arkui-js/js-components-basic-divider.md)
-      - [image](reference/arkui-js/js-components-basic-image.md)
-      - [image-animator](reference/arkui-js/js-components-basic-image-animator.md)
-      - [input](reference/arkui-js/js-components-basic-input.md)
-      - [label](reference/arkui-js/js-components-basic-label.md)
-      - [marquee](reference/arkui-js/js-components-basic-marquee.md)
-      - [menu](reference/arkui-js/js-components-basic-menu.md)
-      - [option](reference/arkui-js/js-components-basic-option.md)
-      - [picker](reference/arkui-js/js-components-basic-picker.md)
-      - [picker-view](reference/arkui-js/js-components-basic-picker-view.md)
-      - [piece](reference/arkui-js/js-components-basic-piece.md)
-      - [progress](reference/arkui-js/js-components-basic-progress.md)
-      - [qrcode](reference/arkui-js/js-components-basic-qrcode.md)
-      - [rating](reference/arkui-js/js-components-basic-rating.md)
-      - [richtext](reference/arkui-js/js-components-basic-richtext.md)
-      - [search](reference/arkui-js/js-components-basic-search.md)
-      - [select](reference/arkui-js/js-components-basic-select.md)
-      - [slider](reference/arkui-js/js-components-basic-slider.md)
-      - [span](reference/arkui-js/js-components-basic-span.md)
-      - [switch](reference/arkui-js/js-components-basic-switch.md)
-      - [text](reference/arkui-js/js-components-basic-text.md)
-      - [textarea](reference/arkui-js/js-components-basic-textarea.md)
-      - [toolbar](reference/arkui-js/js-components-basic-toolbar.md)
-      - [toolbar-item](reference/arkui-js/js-components-basic-toolbar-item.md)
-      - [toggle](reference/arkui-js/js-components-basic-toggle.md)
-      - [web](reference/arkui-js/js-components-basic-web.md)
-      - [xcomponent](reference/arkui-js/js-components-basic-xcomponent.md)
-    - 媒体组件
-      - [video](reference/arkui-js/js-components-media-video.md)
-    - 画布组件
-      - [canvas组件](reference/arkui-js/js-components-canvas-canvas.md)
-      - [CanvasRenderingContext2D对象](reference/arkui-js/js-components-canvas-canvasrenderingcontext2d.md)
-      - [Image对象](reference/arkui-js/js-components-canvas-image.md)
-      - [CanvasGradient对象](reference/arkui-js/js-components-canvas-canvasgradient.md)
-      - [ImageData对象](reference/arkui-js/js-components-canvas-imagedata.md)
-      - [Path2D对象](reference/arkui-js/js-components-canvas-path2d.md)
-      - [ImageBitmap对象](reference/arkui-js/js-components-canvas-imagebitmap.md)
-      - [OffscreenCanvas对象](reference/arkui-js/js-components-canvas-offscreencanvas.md)
-      - [OffscreenCanvasRenderingContext2D对象](reference/arkui-js/js-offscreencanvasrenderingcontext2d.md)
-    - 栅格组件
-      - [基本概念](reference/arkui-js/js-components-grid-basic-concepts.md)
-      - [grid-container](reference/arkui-js/js-components-grid-container.md)
-      - [grid-row](reference/arkui-js/js-components-grid-row.md)
-      - [grid-col](reference/arkui-js/js-components-grid-col.md)
-    - svg组件
-      - [通用属性](reference/arkui-js/js-components-svg-common-attributes.md)
-      - [svg](reference/arkui-js/js-components-svg.md)
-      - [rect](reference/arkui-js/js-components-svg-rect.md)
-      - [circle](reference/arkui-js/js-components-svg-circle.md)
-      - [ellipse](reference/arkui-js/js-components-svg-ellipse.md)
-      - [path](reference/arkui-js/js-components-svg-path.md)
-      - [line](reference/arkui-js/js-components-svg-line.md)
-      - [polyline](reference/arkui-js/js-components-svg-polyline.md)
-      - [polygon](reference/arkui-js/js-components-svg-polygon.md)
-      - [text](reference/arkui-js/js-components-svg-text.md)
-      - [tspan](reference/arkui-js/js-components-svg-tspan.md)
-      - [textPath](reference/arkui-js/js-components-svg-textpath.md)
-      - [animate](reference/arkui-js/js-components-svg-animate.md)
-      - [animateMotion](reference/arkui-js/js-components-svg-animatemotion.md)
-      - [animateTransform](reference/arkui-js/js-components-svg-animatetransform.md)
-    - 自定义组件
-      - [基本用法](reference/arkui-js/js-components-custom-basic-usage.md)
-      - [继承样式](reference/arkui-js/js-components-custom-style.md)
-      - [自定义事件](reference/arkui-js/js-components-custom-events.md)
-      - [Props](reference/arkui-js/js-components-custom-props.md)
-      - [事件参数](reference/arkui-js/js-components-custom-event-parameter.md)
-      - [slot插槽](reference/arkui-js/js-components-custom-slot.md)
-      - [生命周期定义](reference/arkui-js/js-components-custom-lifecycle.md)
-    - [数据类型说明](reference/arkui-js/js-appendix-types.md)
  - 组件参考（基于TS扩展的声明式开发范式）
    - 组件通用信息
      - 通用事件
@@ -632,6 +530,108 @@
        - [文本选择弹窗](reference/arkui-ts/ts-methods-textpicker-dialog.md)
      - [菜单](reference/arkui-ts/ts-methods-menu.md)
    - [文档中涉及到的内置枚举值](reference/arkui-ts/ts-appendix-enums.md)
+  - 组件参考（基于JS扩展的类Web开发范式）
+    - 组件通用信息
+      - [通用属性](reference/arkui-js/js-components-common-attributes.md)
+      - [通用样式](reference/arkui-js/js-components-common-styles.md)
+      - [通用事件](reference/arkui-js/js-components-common-events.md)
+      - [通用方法](reference/arkui-js/js-components-common-methods.md)
+      - [动画样式](reference/arkui-js/js-components-common-animation.md)
+      - [渐变样式](reference/arkui-js/js-components-common-gradient.md)
+      - [转场样式](reference/arkui-js/js-components-common-transition.md)
+      - [媒体查询](reference/arkui-js/js-components-common-mediaquery.md)
+      - [自定义字体样式](reference/arkui-js/js-components-common-customizing-font.md)
+      - [原子布局](reference/arkui-js/js-components-common-atomic-layout.md)
+    - 容器组件
+      - [badge](reference/arkui-js/js-components-container-badge.md)
+      - [dialog](reference/arkui-js/js-components-container-dialog.md)
+      - [div](reference/arkui-js/js-components-container-div.md)
+      - [form](reference/arkui-js/js-components-container-form.md)
+      - [list](reference/arkui-js/js-components-container-list.md)
+      - [list-item](reference/arkui-js/js-components-container-list-item.md)
+      - [list-item-group](reference/arkui-js/js-components-container-list-item-group.md)
+      - [panel](reference/arkui-js/js-components-container-panel.md)
+      - [popup](reference/arkui-js/js-components-container-popup.md)
+      - [refresh](reference/arkui-js/js-components-container-refresh.md)
+      - [stack](reference/arkui-js/js-components-container-stack.md)
+      - [stepper](reference/arkui-js/js-components-container-stepper.md)
+      - [stepper-item](reference/arkui-js/js-components-container-stepper-item.md)
+      - [swiper](reference/arkui-js/js-components-container-swiper.md)
+      - [tabs](reference/arkui-js/js-components-container-tabs.md)
+      - [tab-bar](reference/arkui-js/js-components-container-tab-bar.md)
+      - [tab-content](reference/arkui-js/js-components-container-tab-content.md)
+    - 基础组件
+      - [button](reference/arkui-js/js-components-basic-button.md)
+      - [chart](reference/arkui-js/js-components-basic-chart.md)
+      - [divider](reference/arkui-js/js-components-basic-divider.md)
+      - [image](reference/arkui-js/js-components-basic-image.md)
+      - [image-animator](reference/arkui-js/js-components-basic-image-animator.md)
+      - [input](reference/arkui-js/js-components-basic-input.md)
+      - [label](reference/arkui-js/js-components-basic-label.md)
+      - [marquee](reference/arkui-js/js-components-basic-marquee.md)
+      - [menu](reference/arkui-js/js-components-basic-menu.md)
+      - [option](reference/arkui-js/js-components-basic-option.md)
+      - [picker](reference/arkui-js/js-components-basic-picker.md)
+      - [picker-view](reference/arkui-js/js-components-basic-picker-view.md)
+      - [piece](reference/arkui-js/js-components-basic-piece.md)
+      - [progress](reference/arkui-js/js-components-basic-progress.md)
+      - [qrcode](reference/arkui-js/js-components-basic-qrcode.md)
+      - [rating](reference/arkui-js/js-components-basic-rating.md)
+      - [richtext](reference/arkui-js/js-components-basic-richtext.md)
+      - [search](reference/arkui-js/js-components-basic-search.md)
+      - [select](reference/arkui-js/js-components-basic-select.md)
+      - [slider](reference/arkui-js/js-components-basic-slider.md)
+      - [span](reference/arkui-js/js-components-basic-span.md)
+      - [switch](reference/arkui-js/js-components-basic-switch.md)
+      - [text](reference/arkui-js/js-components-basic-text.md)
+      - [textarea](reference/arkui-js/js-components-basic-textarea.md)
+      - [toolbar](reference/arkui-js/js-components-basic-toolbar.md)
+      - [toolbar-item](reference/arkui-js/js-components-basic-toolbar-item.md)
+      - [toggle](reference/arkui-js/js-components-basic-toggle.md)
+      - [web](reference/arkui-js/js-components-basic-web.md)
+      - [xcomponent](reference/arkui-js/js-components-basic-xcomponent.md)
+    - 媒体组件
+      - [video](reference/arkui-js/js-components-media-video.md)
+    - 画布组件
+      - [canvas组件](reference/arkui-js/js-components-canvas-canvas.md)
+      - [CanvasRenderingContext2D对象](reference/arkui-js/js-components-canvas-canvasrenderingcontext2d.md)
+      - [Image对象](reference/arkui-js/js-components-canvas-image.md)
+      - [CanvasGradient对象](reference/arkui-js/js-components-canvas-canvasgradient.md)
+      - [ImageData对象](reference/arkui-js/js-components-canvas-imagedata.md)
+      - [Path2D对象](reference/arkui-js/js-components-canvas-path2d.md)
+      - [ImageBitmap对象](reference/arkui-js/js-components-canvas-imagebitmap.md)
+      - [OffscreenCanvas对象](reference/arkui-js/js-components-canvas-offscreencanvas.md)
+      - [OffscreenCanvasRenderingContext2D对象](reference/arkui-js/js-offscreencanvasrenderingcontext2d.md)
+    - 栅格组件
+      - [基本概念](reference/arkui-js/js-components-grid-basic-concepts.md)
+      - [grid-container](reference/arkui-js/js-components-grid-container.md)
+      - [grid-row](reference/arkui-js/js-components-grid-row.md)
+      - [grid-col](reference/arkui-js/js-components-grid-col.md)
+    - svg组件
+      - [通用属性](reference/arkui-js/js-components-svg-common-attributes.md)
+      - [svg](reference/arkui-js/js-components-svg.md)
+      - [rect](reference/arkui-js/js-components-svg-rect.md)
+      - [circle](reference/arkui-js/js-components-svg-circle.md)
+      - [ellipse](reference/arkui-js/js-components-svg-ellipse.md)
+      - [path](reference/arkui-js/js-components-svg-path.md)
+      - [line](reference/arkui-js/js-components-svg-line.md)
+      - [polyline](reference/arkui-js/js-components-svg-polyline.md)
+      - [polygon](reference/arkui-js/js-components-svg-polygon.md)
+      - [text](reference/arkui-js/js-components-svg-text.md)
+      - [tspan](reference/arkui-js/js-components-svg-tspan.md)
+      - [textPath](reference/arkui-js/js-components-svg-textpath.md)
+      - [animate](reference/arkui-js/js-components-svg-animate.md)
+      - [animateMotion](reference/arkui-js/js-components-svg-animatemotion.md)
+      - [animateTransform](reference/arkui-js/js-components-svg-animatetransform.md)
+    - 自定义组件
+      - [基本用法](reference/arkui-js/js-components-custom-basic-usage.md)
+      - [继承样式](reference/arkui-js/js-components-custom-style.md)
+      - [自定义事件](reference/arkui-js/js-components-custom-events.md)
+      - [Props](reference/arkui-js/js-components-custom-props.md)
+      - [事件参数](reference/arkui-js/js-components-custom-event-parameter.md)
+      - [slot插槽](reference/arkui-js/js-components-custom-slot.md)
+      - [生命周期定义](reference/arkui-js/js-components-custom-lifecycle.md)
+    - [数据类型说明](reference/arkui-js/js-appendix-types.md)
  - 接口参考（JS及TS API）
    - [开发说明](reference/apis/development-intro.md)
    - Ability框架
@@ -746,7 +746,7 @@
      - [@ohos.resourceManager (资源管理)](reference/apis/js-apis-resource-manager.md)
    - 资源调度
      - [@ohos.backgroundTaskManager (后台任务管理)](reference/apis/js-apis-backgroundTaskManager.md)
-      - [@ohos.distributedMissionManager (distributedMissionManager)](reference/apis/js-apis-distributedMissionManager.md)
+      - [@ohos.distributedMissionManager (分布式任务管理)](reference/apis/js-apis-distributedMissionManager.md)
      - [@ohos.workScheduler (延迟任务调度)](reference/apis/js-apis-workScheduler.md)
      - [@ohos.WorkSchedulerExtensionAbility (延迟任务调度回调)](reference/apis/js-apis-WorkSchedulerExtensionAbility.md)
    - 定制管理