> For the complete documentation index, see [llms.txt](https://helps.ptengine.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://helps.ptengine.com/cn/experience/campaign/code-mode.md).

# 代码模式的使用方法

## 代码模式的使用方法

Ptengine Experience代码模式是一个功能，可以利用HTML、JavaScript和CSS为用户提供更灵活和高级的体验。通过使用此模式，您可以实现标准工具难以实现的复杂功能和自定义设计。

## 代码模式的编辑位置

### 页面编辑器中的"代码模式"

点击按钮，代码模式的设置屏幕将展开。

在此屏幕上，您可以在单独的输入框中编辑JavaScript和CSS。

> **DANGER** **输入JavaScript时的注意事项**
>
> 编写JavaScript时，不需要标记。
>
> ```javascript
> ❌ 错误的例子:
>
> JavaScript
> <script>
> function myFunction() {
>   console.log("Hello, World!");
> }
> </script>
>
> ✅ 正确的例子:
>
> JavaScript
> function myFunction() {
>   console.log("Hello, World!");
> }
> ```

### 菜单栏中的"编辑HTML"项目

单击页面上的元素时，将显示菜单栏。

您也可以使用其中的"编辑HTML"在代码模式中编辑相应元素。

**使用代码模式时的重要注意事项 ⚠️**

**1. 第三方库的使用限制 🚫**

原因:体验功能下降加载速度恶化

建议:尽可能使用纯JavaScript使用最少必要代码实现

**2. 页面元素更改时机 ⏱️**

问题:JavaScript元素更改在页面加载完成后执行根据活动的加载时机，更改可能在元素显示后才被应用风险:更改首屏元素可能会恶化用户体验

建议:不要用JavaScript更改首屏元素尽可能对页面下部或延迟加载的元素进行更改