Javascript 不带父表标记的td

Javascript 不带父表标记的td,javascript,html,css,html-table,Javascript,Html,Css,Html Table,HTML: <td class="tabletd"> text one </td><br> <td class="tabletd" id="tdSecond"> this is next td</td> <button onclick="myFunc()">click</button> function myFunc() { var second = document.getElementById

HTML:

<td class="tabletd"> text one </td><br>
<td class="tabletd" id="tdSecond"> this is next td</td>
<button onclick="myFunc()">click</button>
function myFunc() {
    var second    = document.getElementById('tdSecond').innerHTML;
    //var second2 = document.getElementsByTagName('td')[1]; //gives error undefined
    alert(second);
}
我做不到。甚至css也没有效果,请参见
但是,如果我们使用
  • 而不使用其父级

      而且javascript和css在自定义标记上也可以很好地工作。例如:-
      text


      那么,如果我们在没有父对象的情况下使用
      ,为什么css和javascript都会出错呢?

      试试这个。html有问题。试试这个html

          <table border="1">
      <tr>
      <td class="tabletd"> text one </td><br>
      <td class="tabletd" id="tdSecond"> this is next td</td>
      </tr>
      </table>
      <button onclick="myFunc()">click</button>
      
      
      文本一
      这是下一个td 点击
      如果您检查铬合金中的元素,您会注意到代码已更改为以下内容:

      <body>
          text one <br>
          this is next td
          <button onClick="myFunc()">click</button>
          <script type="text/javascript">//<![CDATA[ 
      
          function myFunc() {
          var second=document.getElementById('tdSecond').innerHTML;
          alert(second);
      
          //var second2=document.getElementsByTagName('td')[1].innerHTML;
          //alert(second2);  
          }
      
          //]]>  
      
          </script>
      </body>
      
      
      文本一
      这是下一个td 点击 //

      td元素已被浏览器剥离,因为它们无效。

      这将解释为什么
    • 项可以没有

        li元素表示一个列表项。如果其父元素是ol, ul或menu元素,则该元素是父项的一项 元素的列表,如为这些元素定义的。否则,列表 项与任何其他li元素没有定义的列表相关关系

        如果父元素是ol元素,则li元素具有 序数值

        仅用于对类似的
      • 项目进行分组。如果没有
        ,则
      • 只是一个单独的列表项,没有任何分组。因此,有一个
      • 而没有
        仍然是解析器将传递的有效标记


        元素必须位于
        元素中。

        这就是解析器形成表的方式,如果使用
        而不使用
        将抛出表模型错误:

        该测试显示:

        <!-- fail -->
        <tr>
          <td>tr_td_test</td>
        </tr>
        
        <!-- fail -->
        <td>td_test</td>
        
        <!-- pass as a regular list item -->
        <li>li_test</li>
        
        <!-- pass and tr tag is added to DOM -->
        <table>
          <td>table_td_test 1</td>
        </table>
        
        <!-- pass and td tag is added to DOM -->
        <table>
          <tr>
            table_tr_test_1
          </tr>
        </table> 
        
        
        tr_td_试验
        td_测试
        
      • li_试验
      • 表(td)测试1 表1
        因为它是无效的HTML。如果你使用无效的HTML,你依赖浏览器的能力来理解它,而不是正常地解析它。@Blender但是为什么没有
        和组合标记的
      • 和组合标记可以很好地工作?为什么你会故意编写无效标记?@PankitKapadia这没关系。在规范中,它给出了“有效”父项的列表。对于
        ,它是
        。对于
      • ,它是
          。那么,仅仅说“在HTML表中”有什么关系呢?在这种情况下,
        • 有什么不同呢?孤独的
        • 是“无效的”,但它不会被剥离。或者一个虚构的
          ?这是个好问题。这取决于浏览器或渲染工具包的判断,我想他们对
          的分析似乎比
        • 更深入。希望有更了解这个主题的人能来给我们一些启发。请在这里查看我的答案:如果你想阅读更多,这是一个HTML解析@3dgoo的链接——HTML解析器的行为更多地是由传统浏览器所做的传统行为而非任何形式的理智决定的,因为现代浏览器需要以与当代浏览器在编写页面时相同的方式处理旧网页。这些旧浏览器的不同程序员在不同的时间选择了不同的策略来处理无效标记。这里既没有押韵也没有理由,只有一大堆具体的规则,这些规则在今天的