# 代码模式的使用方法

## 代码模式的使用方法

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更改首屏元素尽可能对页面下部或延迟加载的元素进行更改


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://helps.ptengine.com/cn/experience/campaign/code-mode.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.