Javascript 单击指定文本时显示信息

我是一个荷兰男孩，有自己的网站，我对所有的编程都是新手。我知道一些基本的HTML，但我的知识仅限于此。现在我想在我的页面上创建一些东西，在那里我可以为计算机提供一些服务等等。 所以在左边，我想列出我所有的服务，在右边，列出该服务的信息。我不希望所有的信息都在右边，我希望当你点击同一页面上的某个服务时，这些信息会出现或消失。当没有服务被点击时，我想有一个关于服务的解释和更多的文本。我想改变信息的可能性，并添加图像和一些HTML插件。我认为这在HTML5（或者Javascript，可能是jQuery）中是可能的，只是我不知道如何实现。 这就是我想要测试它的地方：
我的网站是在Wordpress上运行的，可能会因为我的主机（BlueHost）而变慢，我自己做的，它们非常便宜，现在我知道为什么了。 有没有程序员可以并且想要帮助我解决问题？最好有一些预先编写的代码或只是非常简单的解释，我喜欢学习！ 提前谢谢

---

托马斯

我开始的方式是使用该网站，然后在我建立并运行该网站后参与其中。祝你好运

您的具体问题听起来主要是jQuery/javascript

HTML:

服务：


咨询


程序设计


长板

jQuery：

$('li').click(function(){
    var svc = $(this).attr('id');
    //alert(svc);

    if (svc=="con"){
        $('#msg').html('<h2>Professional Services</h2>I can help with computer consulting.');
    }else if(svc=="pro"){
        $('#msg').html('<h2>Beanie Work</h2>If you can conceive it, I can code it.');
    }else if(svc=="brd"){
        $('#msg').html('<h2>Sidewalk Surfing</h2>Grocery deliveries with style...');
    }
});

$（'li'）。单击（函数（）{
var svc=$（this.attr（'id'）；
//警报（svc）；
如果（svc==“con”）{
$（'#msg'）.html（'专业服务我可以帮助进行计算机咨询'）；
}否则如果（svc==“pro”）{
$（'#msg'）.html（'Beanie work如果你能想到它，我就可以编码它'）；
}否则如果（svc==“brd”）{
$（'#msg'）.html（'人行道冲浪风格…'）；
}
});

---

托马斯，有很多很棒的网站都有免费的教程，可以做你想做的事情

我建议你至少做一些10分钟的免费教程，如果你真的想学习的话，甚至可以全部做。这是一个很好的起点：

这是咨询/记忆jquery选择器/方法的宝贵资源：

---

只要继续点击下一章，它就会带你浏览另外六页。。。打印并储存在大厅下面的小阅览室…

我建议你买一两本书，或者你甚至可以通读一遍，看看你从哪里得到的。但是堆栈溢出不是免费的编码服务。您需要付出一些努力，当您遇到困难或有特定问题时，我们将提供帮助。请参阅对我的答案的修订，以回答您的特定问题。还有一两件事要添加，所以将再次编辑。感谢您的回复，我已经是CodeCodemy的成员，唯一的问题是我的空闲时间。我是一名学生，我没有太多的业余时间，我想让我的网站再好一点。你能告诉我我应该学什么语言来解决这个问题吗？我应该朝哪个方向思考？那应该对我有很大帮助！嗯，学习，CSS HTML5和Javascript/JQuery。是的，网络基础将是一个很好的开始：开始吧，我相信这将是让你跟上进度的最快方式。当我陷入codecademy时，我很快就上瘾了，并在一周内设计了一个网站。另一个测试东西的好网站是jsfiddle.net，这是一个非常快速的尝试想法的方法。您需要的特定语言是jQuery（一个javascript库）。我建议直接去jQ，因为它几乎完成了您在js中需要做的所有事情，并且随着您扩展您的高级知识，您将开始学习js。用另一种方式（js优先）会增加3倍的时间/精力，IMHO。先生，你太棒了，这是我真正需要的东西，一个正确的方向和一个很好的例子，我会学习并尝试理解你键入的所有内容，让我自己制作。

$('li').click(function(){
    var svc = $(this).attr('id');
    //alert(svc);

    if (svc=="con"){
        $('#msg').html('<h2>Professional Services</h2>I can help with computer consulting.');
    }else if(svc=="pro"){
        $('#msg').html('<h2>Beanie Work</h2>If you can conceive it, I can code it.');
    }else if(svc=="brd"){
        $('#msg').html('<h2>Sidewalk Surfing</h2>Grocery deliveries with style...');
    }
});