diff --git a/zh-cn/application-dev/reference/arkui-ts/figures/radio.gif b/zh-cn/application-dev/reference/arkui-ts/figures/radio.gif
index 23e0e828f6ea0a1953ef754fc8623523c99114de..cef6af5813afd7dbdb8a5ee3efa692f00a625237 100644
Binary files a/zh-cn/application-dev/reference/arkui-ts/figures/radio.gif and b/zh-cn/application-dev/reference/arkui-ts/figures/radio.gif differ
diff --git a/zh-cn/application-dev/reference/arkui-ts/figures/searchButton.gif b/zh-cn/application-dev/reference/arkui-ts/figures/searchButton.gif
new file mode 100644
index 0000000000000000000000000000000000000000..531dac026db8144d4f87f70f593c4193a4e870bc
Binary files /dev/null and b/zh-cn/application-dev/reference/arkui-ts/figures/searchButton.gif differ
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-radio.md b/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-radio.md
index b0be410a5a3745df222174e29c53923ab8b8623d..1179d4c365e571e40f368a50813a9d0448993469 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-radio.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-radio.md
@@ -62,6 +62,9 @@ struct RadioExample {
       Column() {
         Text('Radio1')
         Radio({ value: 'Radio1', group: 'radioGroup' }).checked(true)
+          .radioStyle({
+            checkedBackgroundColor: Color.Pink
+          })
           .height(50)
           .width(50)
           .onChange((isChecked: boolean) => {
@@ -71,6 +74,9 @@ struct RadioExample {
       Column() {
         Text('Radio2')
         Radio({ value: 'Radio2', group: 'radioGroup' }).checked(false)
+          .radioStyle({
+            checkedBackgroundColor: Color.Pink
+          })
           .height(50)
           .width(50)
           .onChange((isChecked: boolean) => {
@@ -80,6 +86,9 @@ struct RadioExample {
       Column() {
         Text('Radio3')
         Radio({ value: 'Radio3', group: 'radioGroup' }).checked(false)
+          .radioStyle({
+            checkedBackgroundColor: Color.Pink
+          })
           .height(50)
           .width(50)
           .onChange((isChecked: boolean) => {
@@ -90,4 +99,4 @@ struct RadioExample {
   }
 }
 ```
-![](figures/radio.gif)
+![radio](figures/radio.gif)
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-search.md b/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-search.md
index b3dc5f38fe32a0158d9cdabe26553ac3f3cd21ed..03c7394394aedf0a934661329705e2eedb8c843f 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-search.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-search.md
@@ -66,9 +66,9 @@ Search(options?: { value?: string; placeholder?: ResourceStr; icon?: string; con
 
 | 名称                    | 描述             |
 | ----------------------- | ---------------- |
-| CONSTANT<sup>10+</sup>  | 清除按钮常显样式。 |
-| INVISIBLE<sup>10+</sup> | 清除按钮常隐样式。 |
-| INPUT<sup>10+</sup>     | 清除按钮输入样式。 |
+| CONSTANT  | 清除按钮常显样式。 |
+| INVISIBLE | 清除按钮常隐样式。 |
+| INPUT     | 清除按钮输入样式。 |
 
 ## 事件
 
@@ -104,6 +104,8 @@ caretPosition(value: number): void
 
 ##  示例
 
+### 示例1
+
 ```ts
 // xxx.ets
 @Entry
@@ -119,7 +121,7 @@ struct SearchExample {
       Text('onChange:' + this.changeValue).fontSize(18).margin(15)
       Search({ value: this.changeValue, placeholder: 'Type to search...', controller: this.controller })
         .searchButton('SEARCH')
-        .width(400)
+        .width('95%')
         .height(40)
         .backgroundColor('#F5F5F5')
         .placeholderColor(Color.Grey)
@@ -143,3 +145,43 @@ struct SearchExample {
 ```
 
 ![search](figures/search.gif)
+
+### 示例2
+
+```ts
+// xxx.ets
+@Entry
+@Component
+struct SearchButtoonExample {
+  @State submitValue: string = ''
+
+  build() {
+    Column() {
+      Text('onSubmit:' + this.submitValue).fontSize(18).margin(15)
+      Search({ placeholder: 'Type to search...' })
+        .searchButton('SEARCH')
+        .searchIcon({
+          src: $r('app.media.search')
+        })
+        .cancelButton({
+          style: CancelButtonStyle.CONSTANT,
+          icon: {
+            src: $r('app.media.cancel')
+          }
+        })
+        .width('90%')
+        .height(40)
+        .backgroundColor('#F5F5F5')
+        .placeholderColor(Color.Grey)
+        .placeholderFont({ size: 14, weight: 400 })
+        .textFont({ size: 14, weight: 400 })
+        .onSubmit((value: string) => {
+          this.submitValue = value
+        })
+        .margin(20)
+    }.width('100%')
+  }
+}
+```
+
+![searchButton](figures/searchButton.gif)
\ No newline at end of file
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-container-counter.md b/zh-cn/application-dev/reference/arkui-ts/ts-container-counter.md
index 9afa07186103b7452fa3940f77e65c436f4f081b..70c184a7cb470f04423a35cef2c020728c824a5c 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-container-counter.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-container-counter.md
@@ -29,7 +29,7 @@ Counter()
 
 ## 事件
 
-不支持通用事件和手势， 仅支持如下事件：
+除支持[通用事件](ts-universal-events-click.md)外，还支持以下事件：
 
 | 名称 | 功能描述 |
 | -------- | -------- |