Phương thức wrapInner() trong jQuery

1) Phương thức wrapInner() trong jQuery

- Phương thức wrapInner() dùng để thiết lập phần tử cha cho phần nội dung của tất cả các phần tử được chọn.

<script>
    $(document).ready(function(){
        $("button").click(function(){
            $("p").wrapInner("<span>");
        });
    });
</script>

2) Cách sử dụng phương thức wrapInner() trong jQuery

- Để sử dụng phương thức wrapInner(), chúng ta có hai cú pháp cơ bản như sau:

- Cú pháp 1: Cú pháp này thường được sử dụng trong trường hợp bộ chọn của bạn chỉ tìm được một phần tử trùng khớp, hoặc bạn muốn nội dung của tất cả các phần tử trùng khớp được tìm thấy có chung một kiểu phần tử cha.

$(selector).wrapInner(wrappingElement);

- Cú pháp 2: Cú pháp này thường được sử dụng trong trường hợp bộ chọn của bạn tìm được nhiều phần tử trùng khớp và bạn muốn nội dung của mỗi phần tử sẽ có một kiểu phần tử cha riêng.

- Lưu ý: Tham số "n" trả về chỉ số của phần tử.

$(selector).wrapInner(function(n){
    return wrappingElement;
});

3) Một số ví dụ

<script>
    $(document).ready(function(){
        $("button").click(function(){
            $("p").wrapInner("<span>");
        });
    });
</script>

<script>
    $(document).ready(function(){
        $("button").click(function(){
            $("p").wrapInner(function(n){
                if(n==0){return "<b>";}
                if(n==1){return "<i>";}
                if(n==2){return "<u><i>";}
            });
        });
    });
</script>