1# 应用侧调用前端页面函数 2 3 4应用侧可以通过[runJavaScript()](../reference/apis-arkweb/js-apis-webview.md#runjavascript)方法调用前端页面的JavaScript相关函数。 5 6 7在下面的示例中，点击应用侧的“runJavaScript”按钮时，来触发前端页面的htmlTest()方法。 8 9 10- 前端页面有参。 11 12 ```html 13 <!-- index.html --> 14 <!DOCTYPE html> 15 <html> 16 <body> 17 <script> 18 var param = "JavaScript Hello World!"; 19 function htmlTest(param) { 20 console.log(param); 21 } 22 </script> 23 </body> 24 </html> 25 ``` 26 27- 前端页面无参。 28 29 ```html 30 <!-- index.html --> 31 <!DOCTYPE html> 32 <html> 33 <body> 34 <script> 35 function htmlTest() { 36 console.info('JavaScript Hello World! '); 37 } 38 </script> 39 </body> 40 </html> 41 ``` 42 43 44- 应用侧代码。 45 46 ```ts 47 // xxx.ets 48 import web_webview from '@ohos.web.webview'; 49 50 @Entry 51 @Component 52 struct WebComponent { 53 webviewController: web_webview.WebviewController = new web_webview.WebviewController(); 54 55 aboutToAppear() { 56 // 配置Web开启调试模式 57 web_webview.WebviewController.setWebDebuggingAccess(true); 58 } 59 60 build() { 61 Column() { 62 Button('runJavaScript') 63 .onClick(() => { 64 // 前端页面函数无参时，将param删除。 65 this.webviewController.runJavaScript('htmlTest(param)'); 66 }) 67 Web({ src: $rawfile('index.html'), controller: this.webviewController}) 68 } 69 } 70 } 71 ``` 72 73## 相关实例 74 75针对Web组件开发，有以下相关实例可供参考： 76 77- [JS注入与执行（ArkTS）（Full SDK）（API9）](https://gitee.com/openharmony/applications_app_samples/tree/master/code/BasicFeature/Web/RunJsInWeb)