有没有一种有效的方法可以在以下 JavaScript 中包含我的 <span> 元素？答案

【问题标题】：Is there a valid way to include my <span> element within the following JavaScript?有没有一种有效的方法可以在以下 JavaScript 中包含我的 <span> 元素？
【发布时间】：2011-06-18 08:49:09
【问题描述】：

我有这个简单的小 JavaScript sn-p 来尝试保护我的电子邮件地址：

<p>Email:<br />
<script type="text/javascript">
    mixupE='mywebsite.com'
    mixupE=('myname' + '<span>@</span>' + mixupE)
    document.write(mixupE)
</script>
</p>

问题在于它是唯一不验证 xhtml strict 的代码部分。这与 span @ /span 部分有关。我刚刚包含了跨度，以便我可以将@符号设置为与电子邮件地址的其余部分不同的样式。

有人有更好的方法吗？

理想情况下，我希望验证所有内容：o)

我现在已经解决了这个问题：

<p>Email:<br />
        <script type="text/javascript">
            mixupA='name'
            mixupA=('my' + mixupA)
            document.write(mixupA)
        </script><span>@</span><script type="text/javascript">
            mixupB='site.com'
            mixupB=('myweb' + mixupB)
            document.write(mixupB)
        </script>
</p>

可能不是最好的做事方式，但它似乎有效，我的页面现在验证为 xhtml strict :o)

【问题讨论】：

document.write 是不可取的，而是设置innerHTML
我可以建议一种更好的方法来保护您的电子邮件地址：反转您的电子邮件地址（通过 js 或硬编码或使用后端的字符串反转），然后使用 css: rtl 属性重新反转它所以真正的人实际上可以正确阅读它，而垃圾邮件机器人会倒过来阅读。
如果我用 js 做我现在正在做的事情，但是把字母倒过来让它显示它倒置，然后再用 css 重新倒置它怎么样？听起来不错？
向后的文本搞砸了复制 + 粘贴。粘贴时它会向后显示，但在网页上看起来还不错。
感谢搅拌机！你说得对！我想我会再次将我的文本更改为正确的方式，因为复制+粘贴在我看来非常重要:o)

标签： javascript validation xhtml-1.0-strict

【解决方案1】：

您需要将元素包装在 CDATA 块中，如规范中关于 HTML 和 XHTML 之间差异的部分所述，特别是 script and style elements 部分。

但是，您几乎可以肯定地为您的 XHTML 提供 text/html 内容类型，因此您需要跳过使其与 HTML 足够相似以继续跨浏览器工作。在这种情况下，by commenting out the CDATA markers。

<script type="text/javascript">
    //<![CDATA[
    mixupE='mywebsite.com'
    mixupE=('myname' + '<span>@</span>' + mixupE)
    document.write(mixupE)
    //]]>
</script>

【讨论】：

结束脚本标签不是重复了吗？
我还没有完全理解这一点，但我会研究一下。我猜这基本上是某种嵌套错误，与您实际上不应该在脚本元素中具有跨度元素这一事实有关。谢谢大家的帮助:o)

【解决方案2】：

使用间接方式表示<：

<script type="text/javascript">
  var lt = String.fromCharCode(60);
  mixupE='mywebsite.com'
  mixupE=('myname' + lt + 'span>@' + lt + '/span>' + mixupE)
  document.write(mixupE)
</script>

【讨论】：

这听起来不错，但由于某种原因似乎不起作用？加载 xhtml 页面时，它不显示电子邮件地址。嗯……？
对不起，String.fromCharCode(60)
啊...好吧，这确实有效，谢谢 :o) 我可能会尝试这个，而不是我刚刚添加的相当冗长的修复，作为对原始问题的更新。
我刚刚为你投了票。我认为这是一个很好的答案！ :o)
在此代码中包含 CDATA 块是否是个好主意？

【解决方案3】：

这就是我处理事情的地方。我有以下两种可能性，它们似乎都有效，并且都验证为严格的 xhtml。

<script type="text/javascript">
   <!--
   var lt = String.fromCharCode(60);
   mixupE='mywebsite.com'
   mixupE=('myname' + lt + 'span>@' + lt + '/span>' + mixupE)
   document.write(mixupE)
   //-->
</script>

或

<script type="text/javascript">
   //<![CDATA[
   mixupE='mywebsite.com'
   mixupE=('myname' + '<span>@</span>' + mixupE)
   document.write(mixupE)
   //]]>
</script>

有什么理由让我选择其中一个而不是另一个？

【讨论】：

【解决方案4】：

使用 CDATA 和转义的组合，如下所示：

<script type="text/javascript">
//<![CDATA[
mixupE="mywebsite.com";
mixupE=("myname" + "<span>@<\/span>" + mixupE);
document.write(mixupE);
//]]>
</script>

【讨论】：

【解决方案5】：

最简单的答案就是拆分字符串，这样它就不会认为它是一个实体。这是完全有效的，几乎和你原来的一样：

<p>Email:<br />
<script type="text/javascript">
    mixupE='mywebsite.com'
    mixupE=('myname<' + 'span>@<' + '/span>' + mixupE)
    document.write(mixupE)
</script>
</p>

没有必要混淆尖括号。

但不要忘记您的var 和;。简化为：

<p>Email:<br />
<script type="text/javascript">
    var mixupE='mywebsite.com';
    document.write('myname<' + 'span>@<' + '/span>' + mixupE);
</script>
</p>

【讨论】：