diff --git a/ArkWebKit/entry/src/main/ets/pages/WebUserAgent.ets b/ArkWebKit/entry/src/main/ets/pages/WebUserAgent.ets
index ce14f7ee2627f989e5e0288f97ea6dcbf8004d62..d35f05c284175ac0af98960b113c1970740022ef 100644
--- a/ArkWebKit/entry/src/main/ets/pages/WebUserAgent.ets
+++ b/ArkWebKit/entry/src/main/ets/pages/WebUserAgent.ets
@@ -21,24 +21,33 @@
 import { webview } from '@kit.ArkWeb';
 import { BusinessError } from '@kit.BasicServicesKit';
 
+
 @Entry
 @Component
-export struct WebUserAgent {
+export struct UserAgent {
   controller: webview.WebviewController = new webview.WebviewController();
+  @State userAgent: string = "This is UserAgent";
 
   build() {
     Column() {
-      Button('getUserAgent')
-        .onClick(() => {
+      TextArea({ text: this.userAgent })
+      Web({ src: 'www.example.com', controller: this.controller })
+        .onControllerAttached(() => {
           try {
             let userAgent = this.controller.getUserAgent();
-            console.log("userAgent: " + userAgent);
+            // 检测是否为手机设备
+            let isPhone = userAgent.includes("Phone");
+            // 检测是否为2in1设备  
+            let isPC = userAgent.includes("PC");
+            // 检测是否为平板设备  
+            let isTablet = userAgent.includes("Tablet");
+            this.userAgent =
+              "isPhone: " + isPhone + "\nisPC: " + isPC + "\nisTablet: " + isTablet + "\n\nUA: " + userAgent;
           } catch (error) {
             let e: BusinessError = error as BusinessError;
             console.error(`ErrorCode: ${e.code},  Message: ${e.message}`);
           }
         })
-      Web({ src: 'www.example.com', controller: this.controller })
     }
   }
 }