本文详解如何通过 jquery 实现“点击按钮后统一更改页面中所有 `

` 标签文字颜色”的功能，纠正常见错误用法（如误用 `.on()` 绑定样式、缺失 css 属性名），并提供可直接运行的完整代码示例。

在实际开发中，我们常需通过用户交互（如点击按钮）动态修改页面样式。但初学者容易混淆事件绑定与样式操作的逻辑——例如将 $("p").on(...) 错误地用于直接设置样式，或遗漏 .css() 方法必需的属性名参数。

正确做法是：在按钮的 click 事件处理函数中，直接调用 $("p").css("color", "red")，而非嵌套 .on() 方法（.on() 用于绑定事件，不用于设置样式）。jQuery 的 .css() 方法接受两个参数：CSS 属性名（如 "color"）和目标值（如 "red" 或 "#ff6b35"），支持链式调用且自动作用于所有匹配元素。

cn-json-diff

比较两个 JSON 文件并显示差异。支持嵌套结构、数组及值变更。纯 Python 标准库实现，无需 API 密钥。

下载

以下是修正后的完整 JavaScript 代码（保存为 questao3.js 或内联在 HTML 中）：

$(document).ready(function() {
  // 点击任意 button 时，将所有 <p> 文字颜色改为红色
  $("button").click(function() {
    $("p").css("color", "red");
  });

  // 【进阶】单独为“Clique aqui”按钮添加文本切换功能
  $("#dados").click(function() {
    $(this).text("Já clicou");
  });
});

⚠️ 注意事项：

• 确保 jQuery 已正确加载：您的 HTML 中已引入 https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js，且 <script> 标签位于 </script>