4

我编写了以下 JavaScript 函数：

<script type="text/javascript">
function showVariable(val){         
    if(typeof(val)!=null && typeof(val)!=false &&typeof(val)!=NaN && typeof(val)!=undefined)
        return typeof(val);
    else 
        return val;
}
function print(){
    var val = {1, 2, 3};
    var res = showVariable(val);
    alert(res);
}
</script>

目前，我可以使用警报查看结果，但我想知道是否有另一种方法可以showVariable在我的 html 文档中打印结果。

4

6 回答 6

3

只需使用

function print(){
    var val = {1, 2, 3};
    var res = showVariable(val);
    document.getElementById("myDiv").innerHTML = res;

   //if the target is an input :
   document.getElementById("myDiv").val = res;
}
于 2013-03-23T18:18:02.223 回答
3

其他人指出了如何将文本添加到现有的 HTML 元素。下面描述了几个其他选项。

错误日志

对于调试，一种alert()不那么干扰的替代方法是将文本添加到错误日志中。例如，在带有 Firebug 扩展的 Firefox 中：

if (console.log) console.log(res);

Document.write

另一个可能不适用于这个特定问题但有时很有帮助的选项是使用document.write. 但是，请注意不要在页面加载后使用它，否则它将覆盖页面。

例如，以下内容：

<p>one</p>
<script type="text/javascript">document.write('<p>two</p>');</script>
<p>three</p>
<script type="text/javascript">document.write('<p>four</p>');</script>

将在浏览器中显示，就好像静态 HTML 源代码是：

<p>one</p>
<p>two</p>
<p>three</p>
<p>four</p>

类型

附带说明一下，typeof 运算符返回以下字符串值之一：

    'undefined'
    'null'          // For browsers that support ECMAScript 6+
    'boolean'
    'number'
    'string'
    'function'
    'object'

最初的 if 语句可以重构如下：

Instead of this               Use this                     Or this
-------------------           -----------------            ------------
typeof(val) != null           val !== null
typeof(val) != false          val !== false
typeof(val) != NaN            typeof val == 'number'       !isNaN(val)
typeof(val) != undefined      typeof val != 'undefined'

不确定您是否需要所有这些测试。这取决于你想要做什么。

于 2013-03-23T18:21:46.823 回答
1

您可以输出到元素：

HTML：

<div id="log"></div>

JavaScript：

function print(value) {
    document.getElementById('log').innerHTML += value;
}
于 2013-03-23T18:17:31.693 回答
0

如果是元素，您可以将其设置为 .innerHTML 属性。像这样：

<div id="output"></div>

document.getElementById('output').innerHTML = val;
于 2013-03-23T18:16:32.760 回答
0

你可以试试document.write();

function print(){
        var val = {1, 2, 3};
        var res = showVariable(val);
        document.write(res);
    }
于 2013-03-23T18:33:42.670 回答
0

大多数答案都是正确的。但对于初学者来说，这可能会让人感到困惑。让我把它们分成几个步骤：

问题：假设您想从文本框中收集值并将其打印到 HTML 正文中。

  • 第 1 步：用 id 'result' （或任何东西）声明任何东西
  • 第 2 步：从文本框中收集到变量中。
  • 第 3 步：使用 innerHTML 打印它

<html>
<body>

Hi everyone

<p id="result"></p>
<textarea cols="40" id="SearchText" rows="1"></textarea>

</div>
<button onclick="myFunction()" type="button">Submit!</button>
</div>
<script>
function myFunction() {
    var result = document.getElementById("SearchText").value;
	document.getElementById("result").innerHTML = 'hello' + result;
}
</script>

</div>

</body>
<html>

于 2017-11-11T22:51:20.587 回答