Как вы измените элементы в div, используя ajax?

Question

имеют файлы блейдов в формате списка и файлы блейдов в формате изображений. Здесь есть две кнопки пролета, и я хочу показать вам список различных форматов, когда я нажимаю каждую кнопку. Как мне написать код?

 <span id="penpal-image-view" class="fa fa-th float-right" style="font- size: 25px;"></span> 
        <span id="penpal-list-view" class="fa fa-list float-right" style="font-size: 25px;padding-right:7px;"></span> 

В настоящее время два блейд-файла проверяются только с помощью оператора if, но я хочу изменить этот файл, когда я нажимаю span

  @if( 2 == 2 )
                <div class="row">
                    <div class="col"></div>
                    <div class="col"> 
                            @include('penpal.component.indexTableList')
                    </div>
                    <div class="col"></div>
                </div>
            @else
                @include('penpal.component.indexImageList')
            @endif
        @endif

Answer 1

предположим, что это файл1, и мы получаем изображение из этого файла в файл 2. Это файл, содержащий изображение

echo "<img src="someimage.jpg" />";

Это код file2 мы получаем изображение из файла file1 через AJAX следующим образом:

$("#penpal-image-view").click( function(){
$.ajax({
    url: "url/to/file1",
    method: "POST",
    success:function(data){
        $(".CLASS-OF-DIV").html(data);
    } 
});