Дмитрий Лузанов

@Directive({
  selector: 'textarea[appText]'
})
export class TextDirective {
  @Output() public hasScrollBar = new EventEmitter<boolean>();

  constructor(private readonly elRef: ElementRef<HTMLTextAreaElement>) {}

  @HostListener('change')
  @HostListener('input')
  public changes() {
    const elem = this.elRef.nativeElement;
    this.hasScrollBar.emit(elem.clientHeight < elem.scrollHeight);
  }
}

<textarea appText (hasScrollBar)="print($event)"></textarea>

<div class="audio">
   <span>Название аудио</span>
   <audio controls src="http://www.sample-videos.com/audio/mp3/crowd-cheering.mp3" >
      <p>Ваш браузер не поддерживает аудио</p>
   </audio>
</div>
<div class="audio">
   <span>Название аудио</span>
   <audio controls src="http://www.sample-videos.com/audio/mp3/crowd-cheering.mp3" >
      <p>Ваш браузер не поддерживает аудио</p>
   </audio>
</div>
<div class="audio">
   <span>Название аудио</span>
   <audio controls src="http://www.sample-videos.com/audio/mp3/crowd-cheering.mp3" >
      <p>Ваш браузер не поддерживает аудио</p>
   </audio>
</div>
<div class="audio">
   <span>Название аудио</span>
   <audio controls src="http://www.sample-videos.com/audio/mp3/crowd-cheering.mp3" >
      <p>Ваш браузер не поддерживает аудио</p>
   </audio>
</div>

const audioList = document.querySelectorAll('audio')
let currentAudio

Array.prototype.forEach.call(audioList, audio => {
  audio.addEventListener('play', e => {
		if (currentAudio) currentAudio.pause()
		currentAudio = e.target
	})
})

var objDiv = document.getElementById("your_div");
objDiv.scrollTop = objDiv.scrollHeight;

<svg xmlns="http://www.w3.org/2000/svg"><use href="#СсылкаНаСвгЭлемент"/><svg>

<li class="nav-item">
  <a href="/" class="sub">
    Тест 1
  </a>
  <div class="sub-nav">
    <a href="/">Тест 2</a>
    <a href="/">Тест 3</a>
  </div>
</li>

средствами JS?

<form role="search" id="search" method="get" class="search" action="http://ablethink.ru/">
  <input type="text" value="" name="s" class="search-field" placeholder="Поиск">
  <img class="search-image" src="http://ablethink.ru/wp-content/themes/ablethink/img/search.svg" style="cursor:pointer; cursor:hand" onclick="search.submit()">
</form>

selector {
  pointer-events: none;
}

<input class="input-text" type="text" name="name" value="Your name">
				<input class="input-text" type="text" name="email" value="Email Address">
				<input class="input-text" type="text" name="password" value="Create a Password">
				<input class="input-button" type="button" value="Get started — free forever!">

<input class="input-text" type="text" name="name" placeholder="Your name">
				<input class="input-text" type="text" name="email" placeholder="Email Address">
				<input class="input-text" type="text" name="password" placeholder="Create a Password">
				<input class="input-button" type="button" placeholder="Get started — free forever!">