javascript - 网站的同一页面是否根据传递的变量显示不同的内容？

Question

需要编辑这篇文章，因为我没有正确表达我的问题并且问错了

我正在设计一个网站，我想知道是否可以有一段文本根据条件变量显示不同的内容。

例如如果用户通过网站上的某些先前操作对变量具有不同的值 - 并且两个用户都单击相同的“下一步”按钮转到下一页。基于之前的操作，假设用户 A 将看到与假设用户 B 不同的文本，但他们都在同一页面上。

该页面将是相同的 HTML 文件，但内容会根据以前的数据而有所不同。这可能吗？

我需要为此使用 js，还是只用 HTML 就可以完成的简单操作？

任何帮助将不胜感激，谢谢!

Answer 1

这里有新答案

http://codepen.io/mariocatch/pen/OMQGap?role=manager http://codepen.io/mariocatch/pen/OMQGap?role=employee

从 URL 获取查询参数的快速代码笔。如果查询参数包含 role，则它会获取该值并显示该 Angular 色的特定 UI。

旧答案在这里

下面是一个示例，显示了一些 HTML，并根据单击的按钮调整 div 元素的内容。

HTML:

<div id="content">
  Who are you?
</div>
<hr>
<button type="button" id="btn-foo">
  I am Foo
</button>

<button type="button" id="btn-bar">
  I am Bar
</button>

JavaScript

var fooBtn = document.getElementById('btn-foo');
fooBtn.addEventListener('click', function() {
    var content = document.getElementById('content');
  content.innerHTML = 'Hello, I am Foo.';
});

var barBtn = document.getElementById('btn-bar');
barBtn.addEventListener('click', function() {
    var content = document.getElementById('content');
  content.innerHTML = 'Hello, I am Bar.';
});

JSFiddle