Как сменить тип ввода с пароля на текст с помощью кнопки переключения показа и скрытия?

Question

Мне нужно изменить тип ввода поля пароля. Когда я нажимаю на кнопку, она переключается с показа, чтобы скрыть значение. Кроме того, тип ввода изменен с пароля на текст. Как я могу реализовать ту же функциональность в Laravel, как определено в WordPress -
wordpress/wp-admin/install.php

Может ли кто-нибудь помочь мне понять этот кусок кода:

  <label for="pass1">
    <?php _e( 'Password' ); ?>
  </label>
  </th>
<td>
<div class="">
  <?php $initial_password = isset( $_POST['admin_password'] ) ? stripslashes( $_POST['admin_password'] ) : wp_generate_password( 18 ); ?>

Пожалуйста, объясните следующий код:

<input type="password" name="admin_password" id="pass1" class="regular-text" autocomplete="off" data-reveal="1" data-pw="<?php echo esc_attr( $initial_password ); ?>" aria-describedby="pass-strength-result" />
<button type="button" class="button wp-hide-pw hide-if-no-js" data-start-masked="<?php echo (int) isset( $_POST['admin_password'] ); ?>" data-toggle="0" aria-label="<?php esc_attr_e( 'Hide password' ); ?>">
   <span class="dashicons dashicons-hidden"></span>
   <span class="text"><?php _e( 'Hide' ); ?></span>
</button>

Пожалуйста, объясните эти термины:

data-reveal="1"
data-pw
aria-describedby="pass-strength-result"
data-start-masked

Это атрибуты HTML или Bootstrap?

Скажите, пожалуйста, какие файлы связаны с этим кодом и где.

Answer 1

aria-describedby является атрибутом из JavaScript. https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-describedby_attribute

data-toggle является атрибутом Bootstrap. Пример

aria-label является атрибутом из JavaScript. https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-label_attribute

data-reveal является атрибутом Фонда. https://foundation.zurb.com/sites/docs/v/5.5.3/components/reveal.html