How to target specific .data in my html code

I had a problem updating my posts, it turned out that I was targeting the wrong node for Id. Here is my html code where I am trying to configure Id:

<article class="post col-md-6" data-postid="{{ $post->id }}"> <!-- this is what I need to target -->
          <div class="media postforeach postborderleft" >
               <div class="media-left media-top">

               </div>
              <div class="media-body">
                <header class="post-title"><h5 class="media-heading">{{ $post->title }}<i class="fa fa-angle-down pull-right " aria-hidden="true"></i></h5> </header>
                <p class="post-body"><i>{{ $post->body }}</i></p>
                <div class="info">
                    Posted by {{ $post->user->name }} on {{ $post->created_at }}
                </div>
              @if (Auth::check())
                <div class="interaction">
                      <a href="#" class="like">Like</a> |
                      <a href="#" class="like">Dislike</a>
                @if (Auth::user() == $post->user)
                        |
                      <a href="#" class="edit">Edit</a> |
                      <a href="{{ route('post.delete', ['post_id' => $post->id]) }}" class="like">Delete</a>
                 @endif
                </div>
              @else
                <a href="{{ route('registeration') }}" class="like" style="color: red">Login to interract with posts!</a>
              @endif
            </div>
        </div>
        <br>
    </article>

At the top of the code, you can see <article class="post col-md-6" data-postid="{{ $post->id }}">where I need to get my identifier, and the code I'm trying to get is as follows: postId = event.target.parentNode.parentNode.dataset['postid'];I tried a few more things to get the Id identifier but the only way to succeed is to remove most of my html than I could it would be easy to access it, but that’s not what I want. I appreciate any help.

+4
source share
2 answers

click , . ( ), .parentNode :

postId = event.target.parentNode.parentNode.parentNode.parentNode.dataset['postid'];

, jQuery, closest, ( , ):

postId = $(this).closest('article').data('postid');

( ):

, DOM.

+1

, polyfill , .closest . (polyfill 100% , , )

Polyfill

, .closest, :

var postId = event.target.closest('article.post').dataset['postid'];
0

Source: https://habr.com/ru/post/1668610/


All Articles