为什么“WEB前端技术”前会多一次换行？-慕课网

为什么“WEB前端技术”前会多一次换行？

来源：9-6 setAttribute()方法

慕粉4031128

2017-01-11 12:09

<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>无标题文档</title>

</head>

<body>

  <p id="intro">我的课程</p>  

  <ul>  

    <li title="JS">JavaScript</li>  

    <li title="JQ">JQuery</li>  

    <li title="">HTML/CSS</li>  

    <li title="JAVA">JAVA</li>  

    <li title="">PHP</li>  

  </ul>  

  <h1>以下为li列表title的值,当title为空时，新设置值为"WEB前端技术":</h1>

<script type="text/javascript">

  var Lists=document.getElementsByTagName("li");

  for (var i=0; i<Lists.length;i++)

  {

    var text=Lists[i].getAttribute("title")

    document.write(text +"<br>");

    if(text=="")

    {

    Lists[i].setAttribute("title","WEB前端技术")

    document.write(Lists[i].getAttribute("title")+"<br>");

    }

  }

</script>

</body>

</html>

【运行结果】
JS
JQ

WEB前端技术
JAVA

WEB前端技术

【想实现以下效果】
JS
JQ
WEB前端技术
JAVA
WEB前端技术

写回答关注

2回答

Dod_Annie: 2017-01-11 18:33:38

已采纳

会换行是因为你先打印了所有的Li节点，即使是空的你也打印了。所以应该写判断是否为空，如果为空先赋值再打印，把你代码的顺序改下就好了。

  for (var i=0; i<Lists.length;i++)
 
  {

    var text=Lists[i].getAttribute("title");

  	if(text==""){

    Lists[i].setAttribute("title","WEB前端技术")；

    document.write(Lists[i].getAttribute("title")+"<br>");

    }else{

    document.write(text +"<br>");
    
    }
 
  }

1 0

慕粉4031...

非常感谢！

2017-01-12 13:35:25

共 1 条回复 >