如何使用函数()在另一个内部移动div

时间:2017-12-25 16:08:54

标签: javascript php jquery

我想从我的php文档中移动div的位置并将其移动到文件中的其他位置。

我想在第11行创建一个div,然后使用每行中创建的变量,然后将新创建的div移动到内部: div class =“selector”>

这是我的剧本目前的样子:

 <div class="selector" onclick="showChannels()";><div id="channel">hi</div></div>
        <div id="cCwrapper">
        <?php include 'clientConnections.php';?>
         <?php
            $sql = "SELECT icon, pageName, Channel FROM clientconnections";
            $result = $conn->query($sql);

            if ($result->num_rows > 0) {
            // output data of each row
            while($row = $result->fetch_assoc()) {
            echo 
            '<div class="itemWrapper" onclick="selectChannels()">
            <div class="iconWrapper">
            <img src="'.
            $row["icon"].
            '" style="height: 16px; height: 16px;>
            </div> <!--closes icon wrapper-->
            <div class="channelWrapper">'.
            $row["pageName"]. 
            '</div> <!-- closes channel wrapper-->
            </div> <!--closes item wrapper-->
            ';
        }
            } else {
            echo "Oops! We can't find your connected accounts!";
        }
        ?>

1 个答案:

答案 0 :(得分:2)

function showChannels(){
  $("#selected_new_element").html($(this)[0].outerHTML); // moving div.selector element inside #selected_new_element (replace html value with this one)
  $("#selected_new_element").append($(this)[0].outerHTML); // appending div.selector element inside #selected_new_element
  $(this).remove(); // remove current element, for "moving" element
}

一些很好的参考:

  1. http://api.jquery.com/html/
  2. http://api.jquery.com/append/
  3. https://developer.mozilla.org/en-US/docs/Web/API/Element/outerHTML
  4. https://api.jquery.com/remove/