这个JavaScript函数中发生了什么

What's happening in this javascript function?

本文关键字：发生了 什么 函数 JavaScript 这个      更新时间：2023-09-26

首先，document.body检查什么条件？ 是否存在身体标签？ 其次，eval()参数发生了什么变化？ 我很确定列表中的值正在传递到setBodyAttr以最终产生例如document.body.text="deepblue";（这似乎是已弃用的语法），但这是怎么回事？

如果您注意到列表向下传递属性，例如setBodyAttr('text', value)，text周围有''。 然后eval()与另一个''连接。 另一方面，值不是随''传递的，而是与""内部的''连接起来的。 例如，eval()究竟在做什么来获取所有这些并产生document.body.text="darkblue";？

<html>
  <head>
    <title>DOM Tests</title>
    <script type="application/javascript">
    function setBodyAttr(attr,value){
      if (document.body) eval('document.body.'+attr+'="'+value+'"');
      else notSupported();
    }
    </script>
  </head> 
  <body>
    <div style="margin: .5in; height: 400;"> 
      <p><b><tt>text</tt>color</b></p> 
      <form> 
        <select onChange="setBodyAttr('text',
        this.options[this.selectedIndex].value);"> 
          <option value="black">black 
          <option value="darkblue">darkblue 
        </select>
        <p><b><tt>bgColor</tt></b></p>
        <select onChange="setBodyAttr('bgColor',
        this.options[this.selectedIndex].value);"> 
          <option value="white">white 
          <option value="lightgrey">gray
        </select>
        <p><b><tt>link</tt></b></p> 
        <select onChange="setBodyAttr('link',
        this.options[this.selectedIndex].value);">
          <option value="blue">blue
          <option value="green">green
        </select>  <small>
        <a href="http://www.brownhen.com/dom_api_top.html" id="sample">
        (sample link)</a></small><br>
      </form>
      <form>
        <input type="button" value="version" onclick="ver()" />
      </form>
    </div>
  </body>
</html>

首先，检查 document.body 的条件是什么：是否存在正文标签？

刚好。它正在检查身体元素是否存在。（您可以拥有不带正文标签的 body 元素，因为它的站立和结束标签是可选的）。

其次，eval（） 参数发生了什么变化？我很确定列表中的值被传递到 setBodyAttr 中，最终生成例如 document.body.text="deepblue";（这似乎是已弃用的语法），但它是如何发生的？

eval获取一个字符串并将其作为 JS 执行。

因此，这会生成字符串document.body.text="deepblue";并像执行JS语句一样执行它。

语法没有被弃用，它只是非常糟糕的做法。

明智的方法是：

document.body[attr] = value;
相关文章：