PHP网页使用Notify.js传入HTML列表时显示为原代码而非渲染效果如何解决

默认配置下，Notify.js为防范XSS注入风险，会对传入的消息字符串做HTML转义，以纯文本模式渲染内容，不会自动解析字符串内嵌的HTML标签，因此会看到全部HTML代码被原样输出，而非预期的渲染后结构。

• 方案1：针对单条调用关闭HTML转义规则
  在调用通知方法时传入配置参数，关闭当前消息的转义逻辑，让HTML内容正常渲染，示例代码：

var message = '<p> Please correct following errors and then try again </p><ul><li>value1 is wrong</li><li>value 3 is wrong</li><li>value 5 is wrong</li></ul>';
$.notify(message, {
  className: "error",
  escapeOptions: {
    // 关闭当前消息的HTML转义
    enabled: false
  }
});

安全提示：使用该方式时，必须保证传入的HTML内容是经过严格清洗的可信内容，严禁直接拼接未经处理的用户输入内容，避免触发XSS跨站脚本攻击。

• 方案2：手动构建DOM节点传入，兼顾安全与渲染效果
  如果希望降低安全风险，可以手动构建包含段落、无序列表的DOM结构，将构建完成的节点对象直接传入通知方法，无需修改全局转义配置即可达到预期渲染效果，示例代码：

// 创建消息外层容器
const $msgWrapper = $('<div>');
// 追加前置提示文本段落
$msgWrapper.append($('<p>').text('Please correct following errors and then try again'));
// 创建错误无序列表
const $errorList = $('<ul>');
// 循环将所有错误项追加到列表中
['value1 is wrong', 'value 3 is wrong', 'value 5 is wrong'].forEach(errText => {
  $errorList.append($('<li>').text(errText));
});
$msgWrapper.append($errorList);
// 传入DOM节点触发错误提示
$.notify($msgWrapper, 'error');

该方案中所有文本内容均通过jQuery的text()方法写入，会自动对特殊字符做转义处理，不存在潜在XSS风险，同时可以完全按照预期的结构渲染段落、无序列表等元素。

内容的提问来源于stack exchange，提问作者Ishpreet