在父ID中的<img/>元素之后添加<span>元素

时间:2018-04-04 12:42:17

标签: javascript magento-1.9 appendchild getelementsbytagname

我正在努力制作一个JS代码,它会在某个parrent中的每个<span>标记之后添加<img>元素。

这是HTML结构(缩短版):

<ul id="payment_form_quickpaypayment_payment">
    <li>
        <table>
            <tbody>
                <tr>
                    <td>
                        <input type="radio" class="radio" name="qpayment_type" value="dankort" checked="checked">
                    </td>
                    <td>
                        <img src="/dankort.png" title="Dankort">
                    </td>
                </tr>
                <tr>
                    <td>
                        <input type="radio" class="radio" name="qpayment_type" value="mastercard">
                    </td>
                    <td>
                        <img src="/mastercard.png" title="MasterCard">
                    </td>
                </tr>
                <tr>
                    <td>
                        <input type="radio" class="radio" name="qpayment_type" value="mastercard-debet">
                    </td>
                    <td>
                        <img src="/mastercarddebet.png" title="MasterCard Debet DK">
                    </td>
                </tr>
            </tbody>
        </table>
    </li>
</ul>

我想在每个<span>元素后添加<img>元素,<span>元素中的内容应该是每个title属性的<img>属性中的文本}}

所以部分:

<td>
    <img src="/dankort.png" title="Dankort">
</td>
运行脚本后,

应如下所示:

<td>
    <img src="/dankort.png" title="Dankort">
    <span>Dankort</span>
</td>

这是我尝试过的,但它不起作用:

<script>
    function payLoad() {
        var selectedImage = document.getElementById("payment_form_quickpaypayment_payment").getElementsByTagName('img');

        var i;
        for (i = 0; i < selectedImage.length; i++) {
            var newSpan = document.createElement("span");
            var currentImgTitle = selectedImage[i].title();
            var t = document.createTextNode(currentImgTitle);
            newSpan.appendChild(t);
            selectedImage[i].appendChild(newSpan);
        }
    }
    window.onload = payLoad;
</script>

3 个答案:

答案 0 :(得分:0)

selectedImage[i].appendChild(newSpan);会将span添加到img作为其子级,如果您想让他们成为兄弟姐妹,则需要selectedImage[i].parentNode.appendChild(newSpan);

提示:您可以使用浏览器检查器查看html层次结构。

答案 1 :(得分:0)

你不能<?php if (!function_exists('create_slug')) { function create_slug($string) { $slug = trim($string); $slug = strtolower($slug); $slug = str_replace(' ', '-', $slug); return $slug; } } ?> autoload $autoload['helper'] = array('slug'); Controller $data = array( 'title' => $this->input->post('title'), 'content' =>$this->input->post('content'), 'slug' => create_slug($this->input->post('title')) ); $insert_page = $this->Admin_model->insert_page($data); 它不是一个功能,而是.title()的一个属性。

&#13;
&#13;
img
&#13;
&#13;
&#13;

答案 2 :(得分:0)

你获得头衔attr的方式是错误的。需要做

CAT /path/file/demo.csv | psql -u <username> -h <localhost> -d<database> 
-c "COPY "WeatherStations" ("Station_ID", "Station_Code", "Station_Name", 
"Station_Location") FROM stdin;"

我已经实现了这样的

 var currentImgTitle = selectedImage[i].title;