javascript - console.log()得到的数据，如何输出到页面中
本文介绍了javascript - console.log()得到的数据，如何输出到页面中的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
问 题
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
function get_msg(){
//ajax请求接受，js做处理
var xhr = new XMLHttpRequest();
xhr.onreadystatechange=function(){
if(xhr.readyState==4){
// alert(typeof xhr.responseText);//
eval("var people="+xhr.responseText);
console.log(people);
document.getElementById('res').innerHTML = eval;
}
}
xhr.open('get','./3.php');
xhr.send(null);
}
//把string变为object对象
//eval() 字符串参数->表达式 来运行
</script>
</head>
<body>
<h2>接受信息 并 读取</h2>
<input type="button" value="获取" onclick="get_msg()">
<div id="res"></div>
</body>
</html>我是想在页面中添加一个DIV，把内容输出在这个里，但是我这么写好像不对。怎么样才能给console.log添加一个ID呢？或者怎么把console.log的内容输出到div中呢？
解决方案
本身这个命题就有点问题。console.log()的作用就是用于代码调试的，是控制台输出，这个方法的目的就是对于你不想显示在页面的内容，显示在控制台中，方便代码调试。如果要在页面中输出，有很多方法啊，Element.innnerHTML、Element.text()都是不错的选择啊，再不济还有暴力的document.write()方法，为什么还要那么麻烦的找到console的内容，然后输出到页面呢？换句话说，只要你能console的内容，都可以用document.write()到页面上
题主的代码不过是做了一个ajax，eval是几个意思啊？xhr.send(null)又是几个意思啊？更何况即使是xhr.readyState==4：true,这也只是代表后台接收到数据了，但是有没有给你返回数据，你是不是也要判断一下啊？
题主的如果做原生的ajax，那就最好注意状态码的控制，处理好业务逻辑。如果采用jquery或者angular，将会是更不错的选择
这篇关于javascript - console.log()得到的数据，如何输出到页面中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
