diff --git a/zh-cn/application-dev/reference/apis/js-apis-animator.md b/zh-cn/application-dev/reference/apis/js-apis-animator.md
index 8f522db3cc0989287684126e48cf4410899cea1c..1898cc188ec08a0edb9530639d187a81759dca1c 100644
--- a/zh-cn/application-dev/reference/apis/js-apis-animator.md
+++ b/zh-cn/application-dev/reference/apis/js-apis-animator.md
@@ -14,8 +14,9 @@
 
 ## 导入模块
 
-```js
-import animator, { AnimatorResult } from '@ohos.animator';
+```ts
+import animator, { AnimatorOptions,AnimatorResult } from '@ohos.animator';
+import { BusinessError } from '@ohos.base';
 ```
 ## create<sup>9+</sup>
 
@@ -39,10 +40,9 @@ create(options: AnimatorOptions): AnimatorResult
 
 **示例：** 
 
-  ```js
-import animator, { AnimatorResult } from '@ohos.animator';
-
-let options: AnimatorOptions = { // xxx.js文件中不需要强调显式类型AnimatorOptions
+  ```ts
+import animator, { AnimatorOptions,AnimatorResult } from '@ohos.animator';
+let options: AnimatorOptions = {
   duration: 1500,
   easing: "friction",
   delay: 0,
@@ -84,8 +84,10 @@ reset(options: AnimatorOptions): void
 
 **示例：**
 
-```js
-let options: AnimatorOptions = { // xxx.js文件中不需要强调显式类型AnimatorOptions
+```ts
+import animator, { AnimatorOptions,AnimatorResult } from '@ohos.animator';
+import { BusinessError } from '@ohos.base';
+let options: AnimatorOptions = {
   duration: 1500,
   easing: "friction",
   delay: 0,
@@ -98,7 +100,9 @@ let options: AnimatorOptions = { // xxx.js文件中不需要强调显式类型An
 try {
   animator.reset(options);
 } catch(error) {
-  console.error(`Animator reset failed, error code: ${error.code}, message: ${error.message}.`);
+  let message = (error as BusinessError).message
+  let code = (error as BusinessError).code
+  console.error(`Animator reset failed, error code: ${code}, message: ${message}.`);
 }
 ```
 
@@ -112,7 +116,7 @@ play(): void
 
 **示例：**
 
-```js
+```ts
 animator.play();
 ```
 
@@ -126,7 +130,7 @@ finish(): void
 
 **示例：**
 
-```js
+```ts
 animator.finish();
 ```
 
@@ -140,7 +144,7 @@ pause(): void
 
 **示例：**
 
-```js
+```ts
 animator.pause();
 ```
 
@@ -154,7 +158,7 @@ cancel(): void
 
 **示例：**
 
-```js
+```ts
 animator.cancel();
 ```
 
@@ -168,7 +172,7 @@ reverse(): void
 
 **示例：**
 
-```js
+```ts
 animator.reverse();
 ```
 
@@ -188,9 +192,10 @@ onframe: (progress: number) => void
 
 **示例：**
 
-```js
-let animatorResult = animator.create(options)
-animatorResult.onframe = function(value) {
+```ts
+import animator, { AnimatorResult } from '@ohos.animator';
+let animatorResult:AnimatorResult|undefined = animator.create(options)
+animatorResult.onframe = (value)=> {
   console.info("onframe callback")
 }
 ```
@@ -205,9 +210,10 @@ onfinish: () => void
 
 **示例：**
 
-```js
-let animatorResult = animator.create(options)
-animatorResult.onfinish = function() {
+```ts
+import animator, { AnimatorResult } from '@ohos.animator';
+let animatorResult:AnimatorResult|undefined = animator.create(options)
+animatorResult.onfinish = ()=> {
   console.info("onfinish callback")
 }
 ```
@@ -222,9 +228,10 @@ oncancel: () => void
 
 **示例：**
 
-```js
-let animatorResult = animator.create(options)
-animatorResult.oncancel = function() {
+```ts
+import animator, { AnimatorResult } from '@ohos.animator';
+let animatorResult:AnimatorResult|undefined = animator.create(options)
+animatorResult.oncancel = ()=> {
   console.info("oncancel callback")
 }
 ```
@@ -239,9 +246,10 @@ onrepeat: () => void
 
 **示例：**
 
-```js
-let animatorResult = animator.create(options)
-animatorResult.onrepeat = function() {
+```ts
+import animator, { AnimatorResult } from '@ohos.animator';
+let animatorResult:AnimatorResult|undefined = animator.create(options)
+animatorResult.onrepeat = ()=> {
   console.info("onrepeat callback")
 }
 ```
@@ -277,15 +285,28 @@ animatorResult.onrepeat = function() {
 </div>
 ```
 
-```js
-export default {
-  data: {
-    divWidth: 200,
-    divHeight: 200,
-    animator: null
-  },
+```ts
+import animator, { AnimatorOptions,AnimatorResult } from '@ohos.animator';
+import { BusinessError } from '@ohos.base';
+let DataTmp:Record<string,animator> = {
+  'divWidth': 200,
+  'divHeight': 200,
+  'animator': animator
+}
+class Tmp{
+  data:animator = DataTmp
+  onInit:Function = ()=>{}
+  Show:Function = ()=>{}
+}
+class DateT{
+  divWidth:number = 0
+  divHeight:number = 0
+  animator:AnimatorResult | null = null
+}
+(Fn:(v:Tmp) => void) => {Fn({
+  data: DataTmp,
   onInit() {
-    let options = {
+    let options:AnimatorOptions = {
       duration: 1500,
       easing: "friction",
       delay: 0,
@@ -295,10 +316,15 @@ export default {
       begin: 200.0,
       end: 400.0
     };
-    this.animator = animator.create(options);
+    let DataTmp:DateT = {
+      divWidth: 200,
+      divHeight: 200,
+      animator: null
+    }
+    DataTmp.animator = animator.create(options);
   },
   Show() {
-    let options1 = {
+    let options1:AnimatorOptions = {
       duration: 1500,
       easing: "friction",
       delay: 0,
@@ -308,19 +334,29 @@ export default {
       begin: 0,
       end: 400.0,
     };
+    let DataTmp:DateT = {
+      divWidth: 200,
+      divHeight: 200,
+      animator: null
+    }
     try {
-      this.animator.reset(options1);
+      DataTmp.animator = animator.create(options1);
+      DataTmp.animator.reset(options1);
     } catch(error) {
-      console.error(`Animator reset failed, error code: ${error.code}, message: ${error.message}.`);
+      let message = (error as BusinessError).message
+      let code = (error as BusinessError).code
+      console.error(`Animator reset failed, error code: ${code}, message: ${message}.`);
+    }
+    let _this = DataTmp;
+    if(DataTmp.animator){
+      DataTmp.animator.onframe = (value:number)=> {
+        _this.divWidth = value;
+        _this.divHeight = value;
+      };
+      DataTmp.animator.play();
     }
-    let _this = this;
-    this.animator.onframe = function(value) {
-      _this.divWidth = value;
-      _this.divHeight = value;
-    };
-    this.animator.play();
   }
-}
+})}
 ```
 
   ![zh-cn_image_00007](figures/zh-cn_image_00007.gif)
@@ -501,7 +537,7 @@ update(options: AnimatorOptions): void
 
 **示例：**
 
-```js
+```ts
 animator.update(options);
 ```
 
@@ -529,7 +565,8 @@ createAnimator(options: AnimatorOptions): AnimatorResult
 
 **示例：** 
 
-```js
+```ts
+import animator, { AnimatorOptions,AnimatorResult } from '@ohos.animator';
 let options: AnimatorOptions = { // xxx.js文件中不需要强调显式类型AnimatorOptions
   duration: 1500,
   easing: "friction",
diff --git a/zh-cn/application-dev/reference/apis/js-apis-arkui-componentSnapshot.md b/zh-cn/application-dev/reference/apis/js-apis-arkui-componentSnapshot.md
index 1bce56f12357f1e4b536beaac19fd0e71117eec5..1fe4affe569684b0c4eb686f885ed35fc5915e4e 100644
--- a/zh-cn/application-dev/reference/apis/js-apis-arkui-componentSnapshot.md
+++ b/zh-cn/application-dev/reference/apis/js-apis-arkui-componentSnapshot.md
@@ -11,7 +11,7 @@
 
 ## 导入模块
 
-```js
+```ts
 import componentSnapshot from "@ohos.arkui.componentSnapshot";
 ```
 
@@ -42,14 +42,14 @@ get(id: string, callback: AsyncCallback<image.PixelMap>): void
 
 **示例：**
 
-```js
+```ts
 import componentSnapshot from '@ohos.arkui.componentSnapshot'
 import image from '@ohos.multimedia.image'
 
 @Entry
 @Component
 struct SnapshotExample {
-  @State pixmap: image.PixelMap = undefined
+  @State pixmap: image.PixelMap|undefined = undefined
 
   build() {
     Column() {
@@ -108,14 +108,14 @@ get(id: string): Promise<image.PixelMap>
 
 **示例：**
 
-```js
+```ts
 import componentSnapshot from '@ohos.arkui.componentSnapshot'
 import image from '@ohos.multimedia.image'
 
 @Entry
 @Component
 struct SnapshotExample {
-  @State pixmap: image.PixelMap = undefined
+  @State pixmap: image.PixelMap|undefined = undefined
 
   build() {
     Column() {
diff --git a/zh-cn/application-dev/reference/apis/js-apis-arkui-drawableDescriptor.md b/zh-cn/application-dev/reference/apis/js-apis-arkui-drawableDescriptor.md
index 02e7973dbda226bf1ca6c1e6dc205be8de578d06..3e52e9de9c7f18b494eeeed96d0411d0ab8f0925 100644
--- a/zh-cn/application-dev/reference/apis/js-apis-arkui-drawableDescriptor.md
+++ b/zh-cn/application-dev/reference/apis/js-apis-arkui-drawableDescriptor.md
@@ -10,7 +10,7 @@
 
 ## 导入模块
 
-```js
+```ts
 import { DrawableDescriptor, LayeredDrawableDescriptor } from '@ohos.arkui.drawableDescriptor';
 ```
 
diff --git a/zh-cn/application-dev/reference/apis/js-apis-arkui-inspector.md b/zh-cn/application-dev/reference/apis/js-apis-arkui-inspector.md
index b9552616681981a9be4236e0c4e863abac5d159c..2f987e9e4cfec567e811503cd570d329f6f56b20 100644
--- a/zh-cn/application-dev/reference/apis/js-apis-arkui-inspector.md
+++ b/zh-cn/application-dev/reference/apis/js-apis-arkui-inspector.md
@@ -10,7 +10,7 @@
 
 ## 导入模块
 
-```js
+```ts
 import inspector from '@ohos.arkui.inspector'
 ```
 
@@ -36,8 +36,8 @@ createComponentObserver(id: string): ComponentObserver
 
 **示例：** 
 
-```js
-let listener = inspector.createComponentObserver('COMPONENT_ID'); //监听id为COMPONENT_ID的组件回调事件
+```ts
+let listener:inspector = inspector.createComponentObserver('COMPONENT_ID'); //监听id为COMPONENT_ID的组件回调事件
 ```
 
 ## ComponentObserver