达拉~ 2022-04-13 23:35 采纳率: 64.7%
浏览 79
已结题

使用table布局,span标签放不到table中

在代码中将他放到了table中,但是在控制台还是显示在body中,怎么那个span标签都放不进去


    <table>
        <tr>
            <td class="check1"><input type="checkbox" style="width: 17px; height: 17px;"></td>
            <td id="univalent">24</td>
            <td class="amount">
                <button onclick="cut1()">-</button>
                <input type="text" value="0" id="amount" style="width: 30px;">
                <button onclick="plus1()">+</button>
            </td>
            <td id="btn1"><button onclick="ll()">删除</button></td>
        </tr>
        <tr><span id="price">dada</span></tr>
        <tr>
            <td class="check2"><input type="checkbox" style="width: 17px; height: 17px;"></td>
            <td id="univalent2">22.9</td>
            <td class="amount2">
                <button onclick="cut2()">-</button>
                <input type="text" value="0" id="amount2" style="width: 30px;">
                <button onclick="plus2()">+</button>
            </td>
            <td id="btn2"><button onclick="ll()">删除</button></td>
        </tr>
       
    </table>
    

img

   <script>
        // 获取input节点
        var amount = document.querySelector('#amount')
        var amount2 = document.querySelector('#amount2')
        // 获取单价
        var univalent = amount.parentNode.previousElementSibling.innerHTML
        var univalent2 = amount2.parentNode.previousElementSibling.innerHTML
        // 获取 input节点的value属性值
        var sum = amount.value
        var sum2 = amount2.value
        var price = document.querySelector('#price')

        // console.log(sum2)
        function plus1() {
            sum++
            amount.value = sum
            cost()
        }

        function cut1() {
            sum--
            if (sum < 0) {
                sum = 0
                return
            }
            amount.value = sum
            cost()
        }
        function plus2() {
            sum2++
            amount2.value = sum2
            cost()
        }
        function cut2() {
            sum2--
            if (sum2 < 0) {
                sum2 = 0
                return
            }
            amount2.value = sum2  
            cost()
        }
        function ll(){
            alert('删除成功')
        }

        function cost() {
             price.innerHTML = (univalent * sum + univalent2 * sum2).toFixed(2)
        } 
    </script>

  • 写回答

4条回答 默认 最新

  • iMingzhen 2022-04-14 00:00
    关注

    price的span需要放在tr>td内噢
    比如

          <tr>
            <td>    
              <span id="price">dada</span>
            </td>
          </tr>
    

    效果

    img

    如有帮助请采纳回答谢谢~

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(3条)

报告相同问题?

问题事件

  • 系统已结题 4月22日
  • 已采纳回答 4月14日
  • 创建了问题 4月13日

悬赏问题

  • ¥30 dspbuilder中使用signalcompiler时报错Error during compilation: Fitter failed,求解决办法
  • ¥15 gwas 分析-数据质控之过滤稀有突变中出现的问题
  • ¥15 没有注册类 (异常来自 HRESULT: 0x80040154 (REGDB_E_CLASSNOTREG))
  • ¥15 知识蒸馏实战博客问题
  • ¥15 用PLC设计纸袋糊底机送料系统
  • ¥15 simulink仿真中dtc控制永磁同步电机如何控制开关频率
  • ¥15 用C语言输入方程怎么
  • ¥15 网站显示不安全连接问题
  • ¥15 51单片机显示器问题
  • ¥20 关于#qt#的问题:Qt代码的移植问题