Question 231226 in Html Question posted in
Some basic documentation can be found here.

Html – Hide the first elements of a div

I have this div that displays this text

<address class="address address--tight">
      -17.7353231,-63.1696634, Av. Block, NY00, Miami, United States
</address>

How can I hide the first two elements (the coordinates) to only show the address, city and country

Tags:

2

Answers


  1. 0

    Not possible without some JS/DOM. But ideally you should prepare the data before using it in DOM.

    const $address = document.querySelector('.address');
$address.textContent = $address.textContent.split(',').slice(2).join(',').trimLeft();
    <address class="address address--tight">
      -17.7353231,-63.1696634, Av. Block, NY00, Miami, United States
</address>

    A regex version:

    const $address = document.querySelector('.address');
$address.textContent = $address.textContent.replace(/^[^,]+,[^,]+s*,/, '');
    <address class="address address--tight">
      -17.7353231,-63.1696634, Av. Block, NY00, Miami, United States
</address>

    But the fastest version could be:

    const $address = document.querySelector('.address');
const idx = $address.textContent.indexOf(',', $address.textContent.indexOf(',') + 1) + 1;
$address.textContent = $address.textContent.slice(idx).trimLeft();
    <address class="address address--tight">
      -17.7353231,-63.1696634, Av. Block, NY00, Miami, United States
</address>
    Login or Signup to reply.
  2. 0

    Based on the code provided, you can just take the .textContent of the element, .split it on ,, remove the first two parts, then .join it back with ,. This is highly specific though, and if you are not 100% you will always have this order and those details, this might fail.

    const address = document.querySelector( 'address' );

address.textContent = address.textContent.split( ',' ).slice( 2 ).join( ',' );
    <address class="address address--tight">
      -17.7353231,-63.1696634, Av. Block, NY00, Miami, United States
</address>
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search