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

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

- Phương thức replaceWith() dùng để thay thế phần tử được chọn bởi một nội dung khác.

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

- Với phương thức replaceWith(), ta có hai trường hợp sử dụng tương ứng với hai loại cú pháp:

Cú pháp 1:

- Cú pháp này thường được sử dụng trong trường hợp bộ chọn chỉ tìm được một phần tử trùng khớp duy nhất, hoặc bạn muốn tất các phần tử trùng khớp được tìm thấy đều bị thay thế bởi cùng một kiểu nội dung.

$(selector).replaceWith(content);

- Lưu ý:

• Tham số "content" là nội dung mà bạn muốn thay thế cho các phần tử được chọn.
• Tham số "content" có thể là một nội dung văn bản gì đó hoặc một phần tử HTML.

Cú pháp 2:

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

$(selector).replaceWith(function(index,currentcontent){
    return content;
});

- Dưới đây là bảng mô tả ý nghĩa & cách sử dụng các tham số trong cú pháp trên:

3) Một số ví dụ

<script>
    $(document).ready(function(){
        $("button").click(function(){
            $("p").replaceWith("<h3>Lập Trình Web</h3>");
        });
    });
</script>

<script>
    $(document).ready(function(){
        $("button").click(function(){
            $("p").replaceWith(function(a,b){
                if(a==0){return "<h3>Tài liệu HTML</h3>";}
                if(a==1){return "<i><u>" + b + "</u></i>";}
                if(a==2){return "<h1>" + b + "</h1>";}
            });
        });
    });
</script>

4) Điểm giống và khác giữa replaceWith() & replaceAll()

- Dưới đây là bảng mô tả điểm giống và khác giữa phương thức replaceWith() và replaceAll():