程序员经验分享-hwhale

标签超出 标签
2023-12-12

我一直在努力做的是融入<div>a 内的标签<table>, 部分替换<tr>.

    <table ng-controller="TableController as tc">
        @foreach ($orders as $order)
        <tr class="1stPart">
            //<td>
        </tr>
        <!--From here, <div> is incorporated -->
        <div id="id{{$order->id}}" ng-show'isShow == {{$order->id}}'>
            <tr class="2ndPart">
                //<td>
            </tr>
        </div>
        @endforeach
    </table>

为了简单起见，我希望您想象该表是根据以下结果动态生成的@foreach ($orders as $order)（我正在使用 Laravel 5），并且该表由两部分组成 - 一个由<tr>，另一个在里面<div>.

最终，我将创建一个隐藏/显示的功能<div>通过单击<tr class="1stPart">。要么使用 AngularJSngShow或者 JQuery 的hide().

然而，令我惊讶的是，div 标签在运行时总是超出表格，这只能从 Developer 工具中确认。

（即右键单击 -> 检查 -> 元素）

    <div id="id{{$order->id}}" ng-show'isShow == {{$order->id}}'>

        </div>
    <table ng-controller="TableController as tc">
        @foreach ($orders as $order)
        <tr class="1stPart">
            //<td>
        </tr>
        <!--From here, <div> is incorporated -->
            <tr class="2ndPart">
                //<td>
            </tr>
        @endforeach
    </table>

我无能为力，不明白发生了什么事。

如果您能提供任何建议，我将不胜感激。


Problem:

在开发者工具中你会看到div之外的table元素，因为在 HTML 结构中放置 a 是无效的<div>直接在一个<table>，这就是为什么在浏览器中你会得到<div>呈现在外部<table>因为它是无效的 HTML 代码。

Note:

因此，当您处理表格时，您需要知道的是内容块，例如<div>, <span>...不能直接放入<table> or <tr>标签，但您可以将它们放在<td> or a <th>元素代替。

参考：

请检查允许的内容 in the 使用上下文的部分<table>MDN规范了解更多详情。

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)

javascript

html

css

angularJS

标签超出

标签 的相关文章

随机推荐

标签
我一直在努力做的是融入 div a 内的标签 table 部分替换 tr table foreach orders as order tr class 1stPart td td tr div id gt tr class 2ndPart

热门标签

Powered by Hwhale