javascript 中是否有等效的 php echo/print
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/13633085/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Is there a php echo/print equivalent in javascript
提问by jpeltoniemi
Say I want to print html from inside a script tag.
假设我想从脚本标签内打印 html。
A source like this
像这样的来源
<div>foo</div>
<script>
print('<div>Print this after the script tag</div>');
</script>
<div>bar</div>
should look something like this in browser after the script has run
脚本运行后应该在浏览器中看起来像这样
<div>foo</div>
<script>
print('<div>Print this after the script tag</div>');
</script>
<div>Print this after the script tag</div>
<div>bar</div>
I could write my own code for this purpose but since this looks to me like a very simple problem, I'm guessing either I've missed something or my thinking is flawed in some way and printing is left out intentionally.
我可以为此目的编写自己的代码，但由于这在我看来是一个非常简单的问题，我猜要么我错过了某些东西，要么我的想法在某些方面存在缺陷，并且故意省略了打印。
Also, somewhat related: I'd like to know if a script is (or can be made) aware of the script tags surrounding it. With this information it would be much easier to find the position for the printed html code to be injected into, assuming it's not highly discouraged.
另外，有些相关：我想知道脚本是否（或可以）知道围绕它的脚本标签。有了这些信息，可以更容易地找到要注入的打印 html 代码的位置，假设它不是非常气馁。
To clarify: I don't need you to write a print function for me. I only need to know if a native method to achieve this exists and I've missed it or alternatively the reason it shouldn't be done.
澄清一下：我不需要你为我编写打印功能。我只需要知道是否存在实现此目的的本机方法并且我错过了它，或者不应该这样做的原因。
EDITI realized that I didn't think the question through.
编辑我意识到我没有想通这个问题。
I got my facts straight and now almost everything seems to be working. I should've originally mentioned that the print function was needed inside templates - I'm working on a template engine experiment. I managed to work it out by separating scripts from plain html and concatenating the split html sans scripts with script output.
我明白了我的事实，现在几乎一切似乎都在起作用。我本来应该提到在模板中需要打印功能——我正在做一个模板引擎实验。我设法通过将脚本与纯 html 分离并将拆分的 html sans 脚本与脚本输出连接起来解决了这个问题。
As I was writing the code I noticed that everything wouldn't go so smooth because of the asynchronous nature of js. I guess I was expecting to be able to do any kind of js magic in templates, just like I could in php. Seems like actually supporting async code in a fool-proof manner inside templates will require some more thought.
在编写代码时，我注意到由于 js 的异步特性，一切都不会那么顺利。我想我希望能够在模板中做任何类型的 js 魔术，就像我在 php 中一样。似乎在模板中以一种万无一失的方式实际支持异步代码需要更多的思考。
采纳答案by Mike Brant
You need to use document.write()
你需要使用 document.write()
<div>foo</div>
<script>
document.write('<div>Print this after the script tag</div>');
</script>
<div>bar</div>
Note that this will only work if you are in the process of writing the document. Once the document has been rendered, calling document.write()will clear the document and start writing a new one. Please refer to other answers provided to this question if this is your use case.
请注意，这仅在您正在编写文档时才有效。文档渲染完成后，调用document.write()将清除文档并开始编写新文档。如果这是您的用例，请参阅为此问题提供的其他答案。
回答by Lance
You can use document.write, however it's not a good practice, it may clear the entire page depends on when it's being executed.
您可以使用document.write，但这不是一个好习惯，它可能会清除整个页面，这取决于它何时被执行。
You should use Element.innerHtmllike this:
你应该这样使用Element.innerHtml：
<div>foo</div>
<span id="insertHere"></span>
<div>bar</div>
<script>
document.getElementById('insertHere').innerHTML = '<div>Print this after the script tag</div>';
</script>
回答by Lil' Bits
// usage: log('inside coolFunc',this,arguments);
// http://paulirish.com/2009/log-a-lightweight-wrapper-for-consolelog/
window.log = function(){
log.history = log.history || []; // store logs to an array for reference
log.history.push(arguments);
if(this.console){
console.log( Array.prototype.slice.call(arguments) );
}
};
Using window.logwill allow you to perform the same action as console.log, but it checks if the browser you are using has the ability to use console.log first, so as not to error out for compatibility reasons (IE 6, etc.).
使用window.log将允许您执行与 console.log 相同的操作，但它会检查您使用的浏览器是否能够首先使用 console.log，以免因兼容性原因（IE 6 等）而出错.)
回答by Awesomeness01
You can use
您可以使用
function echo(content) {
var e = document.createElement("p");
e.innerHTML = content;
document.currentScript.parentElement.replaceChild(document.currentScript, e);
}
which will replace the currently executing script who called the echo function with the text in the content argument.
这将用内容参数中的文本替换当前正在执行的调用 echo 函数的脚本。
回答by BloodyLogic
We would create our own function in js like echo "Hello world".
我们会在 js 中创建我们自己的函数，比如 echo "Hello world"。
function echo( ...s ) // rest operator
{
for(var i = 0; i < s.length; i++ ) {
document.write(s[i] + ' '); // quotes for space
}
}
// Now call to this function like echo
echo('Hellow', "World");
Note:(...) rest operator dotes for access more parameters in one as object/array, to get value from object/array we should iterate the whole object/array by using for loop, like above and sis name i just kept you can write whatever you want.
注：（...）其他经营者宠爱于一身的访问在一个对象/数组更多的参数，以获得从对象/数组值，我们应该利用for循环，像上面遍历整个对象/数组，s是名我只是让你可以写什么你要。
回答by Max
From w3school's page on JavaScript output,
从 w3school's page on JavaScript output，
JavaScript can "display" data in different ways:
Writing into an alert box, using window.alert().
Writing into the HTML output using document.write().
Writing into an HTML element, using innerHTML.
Writing into the browser console, using console.log().
JavaScript 可以以不同的方式“显示”数据：
使用 window.alert() 写入警报框。
使用 document.write() 写入 HTML 输出。
使用innerHTML 写入HTML 元素。
使用 console.log() 写入浏览器控制台。
回答by Ed Heal
You can use document.writeor even console.write(this is good for debugging).
您可以使用document.write甚至console.write（这有利于调试）。
But your best bet and it gives you more control is to use DOM to update the page.
但最好的办法是使用 DOM 来更新页面，它为您提供更多控制权。
回答by Zecrow
$('element').html('<h1>TEXT TO INSERT</h1>');
or
或者
$('element').text('TEXT TO INSERT');
回答by hhaseli
this is an another way:
这是另一种方式：
<html>
<head>
<title>Echo</title>
<style type="text/css">
#result{
border: 1px solid #000000;
min-height: 250px;
max-height: 100%;
padding: 5px;
font-family: sans-serif;
font-size: 12px;
}
</style>
<script type="text/javascript" lang="ja">
function start(){
function echo(text){
lastResultAreaText = document.getElementById('result').innerHTML;
resultArea = document.getElementById('result');
if(lastResultAreaText==""){
resultArea.innerHTML=text;
}
else{
resultArea.innerHTML=lastResultAreaText+"</br>"+text;
}
}
echo("Hello World!");
}
</script>
</head>
<body onload="start()">
<pre id="result"></pre>
</body>
