js调试信息输出小技巧

浏览数：40 / 时间：2015年06月09日

原文地址：http://blog.csdn.net/jom_ch/article/details/864574

 

 通常我们在做简单的js调试输出的时候习惯用 alert  函数，这个函数也能解决大多数问题，但遇到如循环输出，滚动条状态监控，鼠标位置等场景的时候，alert就相当的不方便了，下面这个函数可以解决这个问题：

[javascript] view plaincopy
  1. <script type="text/javascript">  
  2.     function __js_debug_msg() {  
  3.         var mydiv = document.createElement(‘div‘);  
  4.         mydiv.id = "js_debug_msg";  
  5.         mydiv.setAttribute(‘style‘,‘position:fixed;width:300px;height:40px;padding:5px;background:#333;line-height:20px;color:#FFF;margin-top:0px;top:0px;right:0px;‘);  
  6.         mydiv.innerHTML="print js debug message.";  
  7.         document.body.appendChild(mydiv);  
  8.     }  
  9.     __js_debug_msg();  
  10. </script>  

将上面这段代码放到需要输出调试信息的页面底部，然后在需要输出调试信息的时候用innerHTML代码alert，如：

[javascript] view plaincopy
  1. document.getElementById(‘js_debug_msg‘).innerHTML = ‘需要输出的信息‘;  

用jqeury的话：

[javascript] view plaincopy
  1. $(‘#js_debug_msg‘).html(‘需要输出的信息‘);  

同样也可以输出错误信息

[javascript] view plaincopy
  1. <script type="text/javascript">  
  2. // 需要放到页面的头部 ，例如head区域  
  3. window.onerror = function(err_msg, filename, line_num) {  
  4.     document.getElementById(‘js_debug_msg‘).innerHTML = ‘error message:‘+err_msg+‘|line:‘+line_num+‘|file:‘+filename;  
  5.     return false;  
  6. }  
  7. </script>  

郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。

标签： class style 代码 java src html 问题 com log class style 代码 java src html 问题 com log

相关文章

随机文章

您可能还喜欢

您可能还喜欢