html - 具有可变 URL 的 HTML onclick 属性

Question

下面的代码用于在单击元素时导航到 Google 网页<li>。

<li onclick="window.location='http://www.google.com';" style="cursor:pointer;">Google</li>

现在我有另一个<li>根据参数访问不同的网站。我试过这个

<script>
  document.write('<li onclick="window.location='http://www.google.com/mmm/yyy/' + random_variable +  'ddd/eee';" style="cursor:pointer;">Google</li>');
  </script>

这不正常。我究竟做错了什么？

Answer 1

你不想使用document.write. 相反，您可以更改标签本身的属性。onClick只是代码中的 javascript，因此您可以替换变量

<li onclick="location.href='http://www.google.com/mmm/yyy/' + random_variable +  'ddd/eee';">Google</li>

有点乱。我个人会用 jQuery 和常规<a>标签来做

Javascript/jQuery

$(document).ready(function() {
    $('#someid').click(function(e) {
        e.preventDefault()
        location.href= 'http://google.com/' + random_variable;
    });
});

或者，如果您的随机变量在加载时可用，您可以替换href属性

$(document).ready(function() {
    $('#someid').attr('href','http://google.com/' + random_variable);
});

HTML

<li><a href="#" id="someid">Google</a></li>

Answer 2

var targetElement = document.getElementById("id");
targetElement.appendChild('<li>...</li>';

第一行找到现有元素，您要在其中插入<li>. 第二行插入它。