自我评价:走在路上的菜鸟,想着CMS|WEB|SEO,做着可以成为牛掰程序seoer的梦!

当前位置:博客 > 前端开发 > JavaScript脚本 >

显示和隐藏(display属性)

作者:灰牛站长•发布时间:2021-07-12 12:14:20•浏览

语法:Object.style.display = value

注意:Object是获取的元素对象,如通过document.getElementById("id")获取的元素。

value取值:
属性
none 此元素不会被显示(即隐藏)
block 此元素将显示为块级元素

看看下面代码:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<h2>JavaScript</h2>
<p id="con">作为一个web开发师来说,如果你想要提供漂亮的网页,令用户满意的商户体验,JavaScript是必不可少的工具</p>
<input type="button" name="" id="" value="不显示段落内容" onclick="hidetext()"/>
<input type="button" name="" id="" value="显示段落内容" onclick="showtext()"/>
<script type="text/javascript">
var mycon = document.getElementById('con');
function hidetext(){
mycon.style.display='none';
}
function showtext(){
mycon.style.display='block';
}
</script>
</body>
</html>

显示和隐藏(display属性)代码

<script type="text/javascript">
function hidetext(){
document.getElementById('con').style.display='none';
}
function showtext(){
document.getElementById('con').style.display='block';
}
</script>

相关文章

  • javascript判断语句if和else

    javascript判断语句if和else

    语法: if(条件){ 条件成立时执行的代码 }else{ 条件不成立时执行的代码 } 假设我们通过年龄来判断是否为成年人,如年龄大于等于18岁,是成年人,否则不是...
    2021-07-12 11.07.08
  • 认识JavaScript语句和符号

    认识JavaScript语句和符号

    JavaScript语句是发给浏览器的命令。这些命令的作用是告诉浏览器要做的事情。 每一句JavaScript代码格式: 语句; 先来看看下面代码 script type="text/javascript"al...
    2021-07-12 11.07.39

手机端