在html中打印javascript数组
[英]print javascript array in html
问题描述
Not sure how to print results onto HTML.
不确定如何将结果打印到 HTML 上。 I can do so through alerts.我可以通过警报做到这一点。 How do I print on the browser?如何在浏览器上打印？
<!DOCTYPE html>
<html>
<body>
<script>
var parsed = "";
var myObject = [{
firstname: "Jane",
lastname: "Doe",
email: "jdoe@email.com"
}, {
firstname: "Ja",
lastname: "joe",
email: "je@email.com"
}, {
firstname: "Janet",
lastname: "joes",
email: "jsse@email.com"
}];
for (i = 0; i < myObject.length; i++) {
var myobj = myObject[i];
for (var property in myobj) {
parsed += property + ": " + myobj[property] + "\n";
alert(property);
alert(myobj[property]);
}
}
alert(parsed);
</script>
</body>
</html>
Not sure how to print results onto HTML.不确定如何将结果打印到 HTML 上。 I can do so through alerts.我可以通过警报做到这一点。 How can I print on the browser?如何在浏览器上打印？
6 个解决方案
解决方案1
2 2015-08-05 10:34:24
<!DOCTYPE html> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> </head> <body> <textarea id="display" style="width:1000px;height:1000px"></textarea> <script> var parsed = ""; var myObject = [{ firstname: "Jane", lastname: "Doe", email: "jdoe@email.com" }, { firstname: "Ja", lastname: "joe", email: "je@email.com" }, { firstname: "Janet", lastname: "joes", email: "jsse@email.com" }]; for (i = 0; i< myObject.length; i++) { var myobj= myObject[i]; for (var property in myobj) { parsed += property + ": " + myobj[property] + "\\n"; } } $("#display").val(parsed); </script> </body> </html>解决方案2
1 2015-08-05 10:28:40
Create an element in your HTML page that will contain the output and assign it an appropriate unique id, such as "target-id".在您的 HTML 页面中创建一个包含输出的元素并为其分配适当的唯一 ID，例如“target-id”。
<html>
<body>
...
<div id="target-id"></div>
...
</body>
</html>
Then use the method below to insert the desried text/HTML into that element.然后使用下面的方法将所需的文本/HTML 插入该元素。
document.getElementById('target-id').innerHTML = 'html data';
See also: Inserting HTML into a div另请参阅： 将 HTML 插入 div
解决方案3
1 2015-08-05 10:32:48
Create an element eg div or label inside the html body with a specific attribute egclass,id,name使用特定的属性 egclass,id,name 在 html 正文中创建一个元素，例如 div 或 label
HTML HTML
<label id="arrayMessage"> </label>
Javascript Javascript
document.getElementById('arrayMessage').innerHTML = parsed ;
Jquery查询
$("#arrayMessage").html(parsed);
You can use other attributes of elements to fetch them by class,name or html tag type.您可以使用元素的其他属性按类、名称或 html 标签类型获取它们。
解决方案4
1 2015-08-05 10:33:07
You could use the simple:你可以使用简单的：
document.write([1,2,3]);
But that ain't going to be too pretty and will override the existing page content.但这不会太漂亮并且会覆盖现有的页面内容。
You could do this:你可以这样做：
...
<body>
<div id="data"></div>
</body>
<script>
var data = document.getElementById('data');
myObject.forEach(function(element) {
var firstname = document.create('div');
var lastname = document.create('div');
var email = document.create('div');
firstname.innerHTML = element.firstname;
lastname.innerHTML = element.lastname;
email.innerHTML = element.email;
data.appendChild(firstname);
data.appendChild(lastname);
data.appendChild(email);
});
</script>
...
解决方案5
1 2020-01-22 11:44:43
For the easiest solution is to use the JSON.stringify() with the indent option and using the tag.最简单的解决方案是使用带有缩进选项和标签的 JSON.stringify()。 JSON.stringify(JSON,null,4) 4 space indent. JSON.stringify(JSON,null,4) 4 个空格缩进。
let pre = document.getElementById('output'); let jstring = JSON.stringify({ a: 1, b:2,c:3 }, null, 4); pre.textContent = jstring;
pre{ border:1px solid grey; min-height:10em;
<pre id="output"></pre>
解决方案6
0 2019-11-19 00:50:31
This is a simple solution we convert the array of objects to a string using JSON.stringify().这是一个简单的解决方案，我们使用 JSON.stringify() 将对象数组转换为字符串。 hope that it what you want to do.希望它是你想做的。
<!DOCTYPE html>
<html lang="en">
<head>
<title>Document</title>
</head>
<body>
<p id="elements"> </p>
<script>
var myObject = [{
firstname: "Jane",
lastname: "Doe",
email: "jdoe@email.com"`enter code here`
}, {
firstname: "Ja",
lastname: "joe",
email: "je@email.com"
}, {
firstname: "Janet",
lastname: "joes",
email: "jsse@email.com"
}];
myObject.forEach(element => {
document.getElementById("elements").innerHTML= JSON.stringify(myObject);
});
</script>
</body>
</html>
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.