当前位置: 首页 > 工具软件 > jquery.map > 使用案例 >

JQ jQ对象的map方法

段干麒
2023-12-01

jQ对象的map方法内部 this 绑定的是Dom对象 不是jQ对象, 所以Dom的属性方法 可以正常使用 但是Jq 全部不行,

但是可以把 this封装成jQ对象 方法: $(this)  类似的还有each filter

eg:

<!--除了列出的3种语言外,请再添加 Pascal、Lua和 Ruby,然后按字母顺序排序节点:-->

<div id="test-div">
    <ul>
        <li><span>JavaScript</span></li>
        <li><span>Python</span></li>
        <li><span>Swift</span></li>
    </ul>
</div>

<script type="text/javascript">

    $(function () {
        "use strict";

        var lang = ['Pascal', 'Lua', 'Ruby'];
        var ele_li = $("#test-div > ul > li");
        var ele_ul = $("#test-div > ul");

        // all language
        ele_li.map(function () {
            // ******这里是没有this.text()的
            lang.push(this.innerText);
        });

        // del old element
        ele_li.remove();

        // sort language then append new element
        lang.sort().map(function (element) {
            var ele_new = "<li><span>" + element + "</span></li>";
            ele_ul.append(ele_new);

        });

    });
</script>

 类似资料: