主页 / 问题 / 1394491
Accepted
Leks
Asked:2022-08-28 21:51:35 +0800 CST2022-08-28 21:51:35 +0800 CST

文字不出现

  • 772

function toggleText() {
  let button = document.querySelector('.toggle-text-button');
  let text = document.querySelector('#text');
  button.addEventListener('click', () => {
   
    if(text.hasAttributes('hidden') == true){
       console.log('adad')
      text.hidden = '';
    }
    text.hidden = true;
  })
}

toggleText()
<button class="toggle-text-button">Нажмите, чтобы спрятать/показать текст</button>
  <div id="text">Текст</div>

  1. 如果条件被触发，为什么文本不出现？
javascript

3 个回答

  1. 也许这样会更好？
    如果条件被触发，为什么文本不出现？
    因为条件if满足后你有条件，text.hidden = true又把文字隐藏了

    const button = document.querySelector('.toggle-text-button');
const text = document.querySelector('#text');

button.addEventListener('click', () => {
  text.classList.toggle('hide');
})
    .hide {
  display: none;
}
    <button class="toggle-text-button">Нажмите, чтобы спрятать/показать текст</button>
<div id="text">Текст</div>

    这对你有用

    function toggleText() {
  let button = document.querySelector('.toggle-text-button');
  let text = document.querySelector('#text');
  button.addEventListener('click', () => {

    if (text.hidden == true) {
      console.log('adad')
      text.hidden = '';
    } else text.hidden = true;
  })
}

toggleText()
    <button class="toggle-text-button">Нажмите, чтобы спрятать/показать текст</button>
<div id="text">Текст</div>

    • 2
  2. Best Answer

    每次text.hidden = true单击按钮时都会执行该行，因为它位于if

    对于解决方案，这条线需要放在一个 blockelse中。

    另一个缺点是与使用有关.hasAttributes，此方法不接受任何参数，如果true元素至少有一个any属性则返回。

    要检查特定属性的存在，您需要使用该方法.hasAttribute

    function toggleText() {
  let button = document.querySelector('.toggle-text-button');
  let text = document.querySelector('#text');
  button.addEventListener('click', () => {
    if (text.hasAttribute('hidden') == true) {
      console.log('adad')
      text.hidden = '';
    } else {
      text.hidden = true;
    }
  })
}

toggleText()
    <button class="toggle-text-button">Нажмите, чтобы спрятать/показать текст</button>
<div id="text">Текст</div>

    • 1

  3. 你需要这样做：

    function toggleText() {
  let button = document.querySelector('.toggle-text-button');
  let text = document.querySelector('#text');

  button.addEventListener('click', () => {
    text.hidden = !text.hidden;
  })
}

toggleText()
    <button class="toggle-text-button">Нажмите, чтобы спрятать/показать текст</button>
<div id="text">Текст</div>

    好吧，或者，如果还有其他事情需要做：

    function toggleText() {
  let button = document.querySelector('.toggle-text-button');
  let text = document.querySelector('#text');

  button.addEventListener('click', () => {
    let isHidden = text.hidden
  
    if (isHidden) {
      console.log('adad')
    }
    
    text.hidden = !isHidden;
  })
}

toggleText()
    <button class="toggle-text-button">Нажмите, чтобы спрятать/показать текст</button>
<div id="text">Текст</div>

    • 1

相关问题