Javascript 如何使用jquery和变量更改div的内容？

您好，我一直在尝试使用jquery更改div的内容，我遇到了以下问题，这是我的代码：

<div id="pages">
   <div id='cssmenu'>
   <ul id="themenu">
   <li class='active'><a href='#'><span>Home</span></a></li>
   <li class=''><a href='#'><span>Modules</span></a></li>
   <li class=''><a href='#'><span>Degrees</span></a></li>
   <li class=''><a href='#'><span>About us</span></a></li>
 </ul>

在js.js中：

var Modules = "<p> 12346 </p>";
var Degrees = "<p> degrees </p>";

$(document).ready(function() {
$('ul#themenu li').click(function() {
    $('li.active').removeClass('active');
    $(this).addClass('active');
    **$('#content').html(Modules);**
});

我想做的是使用与ul列表项span name匹配的变量相应地更改内容，如果您能想出更好的方法，请让我知道，提前谢谢您，Chris。

好吧，请尝试：

$('#content').html(Modules);

使用更改元素内容

或者仅使用javascript和getElementById属性：

document.getElementById("content").innerHTML=Modules;

那就试试吧：

$('#content').html(Modules);

使用更改元素内容

或者仅使用javascript和getElementById属性：

document.getElementById("content").innerHTML=Modules;

---

我相信您需要以某种方式将JS数据映射到HTML元素。一种简单的方法是将类或ID附加到元素，以便您可以直接访问它，现在它将包括获取span标记的文本，然后使用该值访问全局数据

在单击功能中使用当前模型

var key = $(this).find('span').text(); // Modules
window[key] // var Modules = "<p> 12346 </p>"

单击后

---

数据[$this.attr'id']

我认为您需要以某种方式将JS数据映射到HTML元素。一种简单的方法是将类或ID附加到元素，以便您可以直接访问它，现在它将包括获取span标记的文本，然后使用该值访问全局数据

在单击功能中使用当前模型

var key = $(this).find('span').text(); // Modules
window[key] // var Modules = "<p> 12346 </p>"

单击后

---

数据[$this.attr'id']

如果我理解正确，您正在尝试使用菜单项的名称来确定要使用的内容。我会将其保存在如下对象中：

var text = {
   Modules : "<p> 12346 </p>",
   Degrees : "<p> degrees </p>"
};

---

仅供参考，最好不要使用.text，而是在li中添加ID或类并将其关闭。

如果我理解正确，您将尝试使用菜单项的名称来确定要使用的内容。我会将其保存在如下对象中：

var text = {
   Modules : "<p> 12346 </p>",
   Degrees : "<p> degrees </p>"
};

---

仅供参考，如果不使用.text，而是将ID或类添加到li并将其关闭，可能会更干净。

单击最后一个树链接查看输出，您可以执行以下操作

变量模块=

12346； 变量度=

学位

； var Aboutus=

关于我们

； $document.readyfunction{ $'ulthemenu li'。单击函数{ $'li.active'。删除类'active'； $this.addClass'active'； //警报$this.find'span'.text.replace/\s+/g； $'content'.htmlwindow[$this.find'span.text.replace/\s+/g，]； }; };

---

单击最后一个树链接查看输出，您可以执行以下操作

变量模块=

12346； 变量度=

学位

； var Aboutus=

关于我们

； $document.readyfunction{ $'ulthemenu li'。单击函数{ $'li.active'。删除类'active'； $this.addClass'active'； //警报$this.find'span'.text.replace/\s+/g； $'content'.htmlwindow[$this.find'span.text.replace/\s+/g，]； }; };

---

第一行代码无效，因为jQuery对象没有innerHTML属性。第一行代码无效，因为jQuery对象没有innerHTML属性。