我们可以使用一些简单的短语定义成 Semantic UI 里的动作 .. 这些动作会对应服务端的某个地址 .. 在这些地址里可以包含必填或者可选的参数 .. 界面上的元素可以使用这些动作去做对应的事情 ...

比如我们可以定义一个 posts 动作 .. 去得到网站里的文章内容 .. 先添加一个按钮 .. button.ui.button .. 执行 ..

然后再添加点 JavaScript .. 这里我们先找到页面上的这个按钮 ... 然后使用 api 这个方法去配置一下跟这个按钮对应的 api 动作 ..

给它一个对象参数 .. 然后用一个 action 属性 ... 指定一下 api 动作的名字 .. 比如 posts .. Semantic 会自动的根据元素的类型，去决定触发执行这个动作的事件 .. 比如在按钮上应该就是 onclick 点击事件 .. 在 input 元素上是 oninput .. 表单上就是 onsubmit 提交的事情 ..

$('.ui.button').api({
action: 'posts',
});

下面我们再去配置一下 posts 这个动作对应的地址 .. 这些配置可以放在 $.fn.api.settings.api 这里 .. 它的值是一个对象 ... 然后添加一个 posts 属性 ... 它的值就是这个对作对应的地址 ... 这个地址是我们的 WordPress 网站的地址 .. 加上斜线 wp-json/posts ..

保存一下 ... 先打开浏览器的控制台 .. . 然后点击页面上的这个按钮 ... 这样会执行 get posts 动作 .. 默认就会使用 GET 方法去请求这个动作对应的地址 ...

你会看到控制台上输出了一些东西 ... 第一块应该是请求的过程 .. 先是去 Looking up url for action .. 查找动作对应的地址 ... 找到以后就会 Querying URL .. 查询这个地址 .. 然后是 Sending request .. 发送请求 ..

再看下面这块 .. 提示 Successful API Response .. 意思是我们成功的得到了服务端的响应 .. 在这个响应里会包含请求得到的内容 .. 就是网站上的一些文章内容 ... 我们可以利用一下这些内容，比如可以把它们显示在页面上 ..