使用Blogger API时，下拉框切换无法更新blog1 div内容的问题

• 核心问题：getBlogidval 函数中使用的 data 变量未定义。handleResponse 函数接收的 response 数据仅在该函数内部可用，未保存到全局作用域，导致切换下拉选项时无法获取博客文章数据。
• 次要问题：
  1. handleResponse 中生成的 <select> 标签未正确闭合（末尾误写为 <select>，应为 </select>）。
  2. getBlogidval 仅更新了文章标题，未同步更新文章内容，与初始显示结构不一致。

<script>
    // 定义全局变量存储博客数据
    let blogData;

    function getBlogidval(selectObject) {
        var value = selectObject.value;
        var upblog = document.getElementById("blog1");
        // 使用全局变量获取对应文章数据，同步更新标题和内容
        upblog.innerHTML = "<h2>" + blogData.items[value].title + "</h2><br>" + "<p>" + blogData.items[value].content + "</p>";
    }

    function handleResponse(response) {
        // 将API返回的数据保存到全局变量，供其他函数调用
        blogData = response;
        document.getElementById("blog0").innerHTML = "<select id='Blogidval' onchange='getBlogidval(this)' width='100%' align='center'><option value='0'><h2>" +
            response.items[0].title + "</h2></option>" + "<option value='1'><h2>" + response.items[1].title + "</h2></option>" + "<option value='2'><h2>" +
            response.items[2].title + "</h2></option>" + "<option value='3'><h2>" + response.items[3].title + "</h2></option></select>";
        document.getElementById("blog1").innerHTML = "<h2>" + response.items[0].title + "</h2><br>" + "<p>" + response.items[0].content + "</p>";
    }
</script>

<script src="https://www.googleapis.com/blogger/v3/blogs/3213900/posts/8398240586497962757?callback=handleResponse&key=YOUR-API-KEY"></script>

• 新增全局变量 blogData，在 handleResponse 中将API返回的 response 赋值给它，让其他函数能访问到博客数据。
• 修改 getBlogidval 函数，用 blogData 替代未定义的 data，并补充文章内容的更新逻辑。
• 修复 <select> 标签的闭合错误。

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