求老师解答

<!DOCTYPE html>
<html>
    <head lang="en">
        <meta charset="UTF-8">
        <title>setInterval()</title>
        <style type="text/css">
            div{
                width:300px;
                height:300px;
                border:1px solid #333;
            }
        </style>
    </head>
    <body>
        <input type="button" value="开始">
        <br><br>
        <div id="div1"></div>
        <script type="text/javascript">
           //补充代码
           var btn=document.getElementsByTagName("input")[0];
           var div1=document.getElementById("div1");
           btn.onclick=function(){
               setInterval(function(){
                div1.innerHTML="hello &nbsp;"+div1.innerHTML;
               },1000);
           }
        </script>
    </body>
</html>

这个代码里面：

div1.innerHTML="hello  "+div1.innerHTML;这个改为 div1.innerHTML="hello "+“&nbsp；”+div1.innerHTML;为啥会打印到div外面去

慕侠5902054 2019-10-19

源自：JS BOM基础 1-26 编程练习

收起

4回答

好帮手慕夭夭回答被采纳获得+3积分 2019-10-21 14:33:36

你好同学，请认真看一下老师的回复，明确的说了两种代码实现的效果都是一样的哦，所以同学自己再重新测试一下。

祝学习愉快，望采纳。

收起回答

慕侠5902054 提问者 #1

噢噢，我明白了，也就是说是浏览器的问题，代码是对的咯

2019-10-21 14:34:32
好帮手慕夭夭回复提问者慕侠5902054 #2

对浏览器解析的问题，不过为了避免出现此问题，建议同学按照老师回复中的方式，改为手动空格更好哦。

2019-10-21 15:35:32

好帮手慕夭夭 2019-10-20 17:47:55

你好同学，你说的是如下这样吧：

如上效果和 div1.innerHTML="hello "+" "+div1.innerHTML;效果是一样的，如下：

360 ，火狐，谷歌浏览器都是如下效果

建议同学使用谷歌再重新测试一下，可能是不同浏览器解析的问题，不过按照老师上次给出的建议改为手动的空格更好。如果还有疑惑，可以把自己测试的代码粘贴到问答区，以便老师准确的为你查找问题。

祝学习愉快，望采纳。

收起回答

提问者慕侠5902054 #1

啥意思，那个如下效果对应的是什么代码

2019-10-21 14:28:00

好帮手慕夭夭 2019-10-20 16:52:29

你好同学， 在页面中虽然会显示一个空格，但是在解析html结构的时候，会与前面其他的字符连接在一起当成一个整体的单词。一个单词是不会自动换行的。所以才会有了同学所描述的效果。

这里建议用键盘空格键手动敲一个空格，如下：

祝学习愉快，望采纳。

收起回答

提问者慕侠5902054 #1

但是把nbsq;写在hello那个双引号里面就行，就能实现效果

2019-10-20 16:54:52

好帮手慕慕子 2019-10-19 17:06:32

同学你好，不是很清楚你这里描述的打印到div外面去具体是指什么样的效果呢，老师测试你的代码，修改为 div1.innerHTML="hello "+" "+div1.innerHTML;这种写法，点击开始之后，如下图所以，会在下方超出div边框

老师这里给同学提供一个参考思路，可以添加一个“结束”按钮，点击的时候清除定时器，停止想div里添加内容，参考下面的代码实现

同学可以下去测试一下哦

如果还有疑问，可以再次提问，详细的描述一下具体指的是什么情况（可以将效果截图粘贴过来），便于老师准确高效的帮助你解决问题

如果帮助到了你，欢迎采纳！

祝学习愉快~~~

收起回答

提问者慕侠5902054 #1

<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title>setInterval()</title> <style type="text/css"> div{ width:300px; height:300px; border:1px solid #333; } </style> </head> <body> <input type="button" value="开始"> <br><br> <div id="div1"></div> <script type="text/javascript"> //补充代码 var btn=document.getElementsByTagName("input")[0]; var div1=document.getElementById("div1"); btn.onclick=function(){ setInterval(function(){ div1.innerHTML="hello"+" "+div1.innerHTML; },1000); } </script> </body> </html> 老师是这个代码，我执行就是会只打印一行hello在div内，其他跑外面去了

2019-10-20 16:40:35