Javascript 切换按钮到空白换行/nowrap

标签 javascript html css

我正在尝试构建一个切换开关,单击它可以添加或删除空格换行。

必须包裹的div不能有ID,所以需要通过它的类来识别。在本例中为“文本”。在整个页面上,该类仅使用一次。

我构建了这个,但它不起作用。我哪里出错了?

<script>
function togglew(){    
     if(document.getElementsByClassName("text")[0].style.whiteSpace == 'nowrap'){
      document.getElementsByClassName("text")[0].style.whiteSpace == 'normal';
     }else{
        document.getElementsByClassName("text")[0].style.whiteSpace == 'nowrap';
     }
}
</script>

<a onclick="togglew('');">toggle wrap button</a> 
<br>---<br>
<div style="width:500px;">
    <div class="text" style="overflow:auto;white-space:wrap">ssssssssssd fdfsdfsdf sdf sdf sdf sfd sdf sdf sdf ssdfdddddddddddf sdf sdf sdf sdfsd fsdf sdfsdf sdf sdfsd f</div>
</div>

最佳答案

== 是比较运算符,而 = 是赋值运算符。

if 条件内你应该比较 (==),在 block 内你应该分配 (=);

if(document.getElementsByClassName("text")[0].style.whiteSpace == 'nowrap')
{
    document.getElementsByClassName("text")[0].style.whiteSpace = 'normal';
} else {
    document.getElementsByClassName("text")[0].style.whiteSpace = 'nowrap';
}

为了完整性,还有 === 比较运算符,它检查运算符是否属于同一类型(== 如果操作数的类型不同,则执行类型强制转换)。有关详细信息,请参阅 Which equals operator (== vs ===) should be used in JavaScript comparisons? .

关于Javascript 切换按钮到空白换行/nowrap,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8952596/

相关文章:

html - 元素相互漂浮,即使它们是 block ?

javascript - 重新加载时在 js 文件中的 chrome 中注入(inject) console.log()

javascript - 为什么在使用 jQuery replaceWith() 时标记 <constructor> 会导致 'undefined'?

javascript - 将点击事件绑定(bind)到 Angular 链接器中的元素和子元素

jquery - jQM页脚在转换前后消失和出现

html - <A> 中的换行符不起作用

javascript - express.js req.body 在中间件中未定义

javascript - 在 React Native 中使用子数据调用父函数

javascript - 在 kendo ui 网格中上下滚动时取消选中复选框

html - ios文本输入: cursor misplaced