Помогите пожалуйста с функцией showText(el)

<h3>list Element Item</h3>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Omnis a, consequuntur recusandae delectus reprehenderit ipsa perspiciatis dignissimos aliquid consequatur debitis facere. Praesentium ratione quisquam possimus ducimus, iusto nemo porro libero.</p>
button onclick="showText(this)">Read More...</button>

html code


function showText(el) {
	if (el.priviousElementSibling.clientHeight === 80) {
		el.priviousElementSibling.style.height = "100%";
		el.innerHTML = "Show Less...";
	} else {
		el.priviousElementSibling.style.height = "80px";
		el.innerHTML = "Read More...";
	}
}

jsva script code


Обьясни-те, что я делаю не так?

джава скрипт должен полностю открывать статью, а он чего то не открывает, как и был текст на 80 пикселей, так и остаеться, выдает ошибку вот здесь


<button onclick="showText(this)">Read More...</button>
________________________
clientHeight === 80) 

(надеюсь ясно обьяснил)

He вполне понятно, что именно должен делать код, но как минимум есть опечатка здесь:
priviousElementSibling
должно быть
previousElementSibling

если проблема не решится, попробуй переформулировать вопрос.

1 лайк

Дело скорее всего в строгом сравнении с 80. Поменяй на <= 80. if (el.priviousElementSibling.clientHeight <= 80) {


Подобные проблемы дебажить самостоятельно, пошагово проверяя через вставку console.log. Сначала проверить какая ветка условия выполняется, потом почему выполняется не та ветка условия (сравнить фактическое значение el.priviousElementSibling.clientHeight === 80 с тем что ты ождаешь для случая когда текст должен открываться).

Свойство height, указанное в %, работает только если для внешнего блока указана высота.
Если высота внешнего блока вычисляется по содержимому, то высота в % не работает, и заменяется на height:auto.