如何以正确的方式在JavaScript中插入HTML文本？ [英] How can I insert HTML text in Javascript the right way?
问题描述
我有这样的代码：
var p = document.createElement（p）;
p.innerHTML =欢迎来到Akecheta，网络战士社交网络在这里，你和放大器;＃39;会找到博客模板，一个自由职业者区域，问题和放大器;放大器;&安培; NBSP;答案论坛，创建自己的博客，并可以与其他人进行互动。< br />
免费模板，免费Blogger模板下载，blogspot博客模板，免费下载，免费模板blogspot博客，免费模板为blogspot博客下载。;
document.body.appendChild（p）;
但控制台正在返回一个错误。我检查了它，它看起来像HTML代码打破了JavaScript代码。这个错误直接指向了这一行：欢迎来到网络战士社交网络Akecheta，在这里你会发现博客模板，
如果我能'我澄清了我的问题，我不知道如何用言语表达。发生了什么事情是，整个脚本没有运行，因为该html内容，我认为它格式不正确。
编辑1
$ b
完整代码：
< script> //<！[CDATA [
var regex = new RegExp（/ testurl / $）;
if（document.URL.match（regex））
{
var p = document.createElement（p）;
p.innerHTML =欢迎来到网络战士社交网络Akecheta，在这里您可以找到博主模板，自由职业者区域，问题与答案论坛，甚至可以创建您的自己的博客与他人互动和LT; BR />< BR />下载免费的Blogger模板，免费的Blogger模板下载，为的Blogspot博客，免费下载，BlogSpot的博客免费的模板，为的Blogspot博客下载免费模板，模板。;
document.body.appendChild（p）;
}
else {
document.write（''）;
}
//]]>< / script>
编辑2
所以我试过了：
< script> //<！[CDATA [
var regex = new RegExp（/ free-blogger-templates / $）;
if（document.URL.match（regex））
{
document.write（'欢迎来到网络战士社交网络Akecheta，在这里您可以找到博主模板，一个自由职业者区，问题与答案论坛，甚至可以创建自己的博客与其他人进行互动。< br />下载免费Blogger模板，免费Blogger模板下载，blogspot博客模板，免费下载，免费模板对于blogspot博客，可以下载blogspot博客的免费模板。'）;
}
else {
document.write（''）;
}
//]]>< / script>
它完全有效。但是这段代码被插入所见即所得编辑器中，所以无论何时我将html编辑器更改为可视化编辑器并返回到html编辑器，文本代码都会被剥离。
最终编辑
这是我的代码完全可用，这段代码应该隐藏/显示基于浏览器地址的文本，如果你想要使用它，只需将 / free-blogger-templates / 更改为您要运行脚本的当前页面，例如，如果您正在 yoursitedotcom / myfirstpage strong>，将其更改为 / myfirstpage / $ ，$意味着它只会允许url直到前面的斜杠 / ，我不得不使用 document.write ，我知道这不是推荐，但这是我发现的唯一解决方案，它是：
< script> ; //<！[CDATA [
var regex = new RegExp（/ free-blogger-templates / $）;如果（document.URL.match（正则表达式））{文件撰写（欢迎来到Akecheta，网络战士社交网络在这里you\'ll找到博客模板，一个自由职业者区域，问题\&放大器;放大器;答案论坛您可以创建自己的博客来与其他人进行交互。下载免费的Blogger模板，免费的Blogger模板下载，为blogspot博客提供的模板，免费下载，免费的blogspot博客模板，免费的blogspot博客模板下载。 } else {document.write（''）; }
//]]>< / script>
文本必须正确转换（感谢用户@ God是好的（是的，上帝是真的很好=]），然后我用 http://www.web2generators.com/html/entities来编码HTML文本。
你需要转义你的一些字符。
$ b
变种p值=使用document.createElement（ p ）; p.innerHTML = 欢迎来到Akecheta，网络战士社交网络这里you\'ll找到的博客模板，自由职业者区域，问题与答案论坛，甚至可以创建自己的博客与其他人进行交互。< br />< br />下载免费Blogger模板，免费Blogger模板下载，模板为blogspot博客，免费下载，为blogspot博客免费模板，免费的blogspot博客模板下载。; document.body.appendChild（P）;
编辑：整个代码应该看起来像这个JSFIDDLE。
I have this code:
var p = document.createElement("p");
p.innerHTML = "Welcome to Akecheta, the web warrior social network. Here you'll find blogger templates, a freelancers area, Question & Answers Forum, create your own blog and will be able to interact with other people.<br />
Download Free Blogger Templates, Free Blogger Templates Download, Templates for blogspot blogs, Free download, Free templates for blogspot blogs, Free templates for blogspot blogs download.";
document.body.appendChild(p);
But the console is returning an error. I checked it out, it looks like the html code is breaking the javascript code. The error points directly to this line "Welcome to Akecheta, the web warrior social network. Here you'll find blogger templates,"
I'm sorry if I can't clarify my question, I don't know how to put that into words. What's happening is that the whole script is not running because of that html content, I believe it's badly formatted.
EDIT 1
Full code:
<script>// <![CDATA[
var regex = new RegExp("/testurl/$");
if(document.URL.match(regex))
{
var p = document.createElement("p");
p.innerHTML = "Welcome to Akecheta, the web warrior social network. Here you\'ll find blogger templates, a freelancers area, Question \& Answers Forum. You can even create your own blog to interact with other people.<br/><br/>Download Free Blogger Templates, Free Blogger Templates Download, Templates for blogspot blogs, Free download, Free templates for blogspot blogs, Free templates for blogspot blogs download.";
document.body.appendChild(p);
}
else {
document.write('');
}
// ]]></script>
EDIT 2
So I tried this:
<script>// <![CDATA[
var regex = new RegExp("/free-blogger-templates/$");
if(document.URL.match(regex))
{
document.write('Welcome to Akecheta, the web warrior social network. Here you\'ll find blogger templates, a freelancers area, Question \& Answers Forum. You can even create your own blog to interact with other people.<br/>Download Free Blogger Templates, Free Blogger Templates Download, Templates for blogspot blogs, Free download, Free templates for blogspot blogs, Free templates for blogspot blogs download.');
}
else {
document.write('');
}
// ]]></script>
And it fully worked. But this code is being inserted on a WYSIWYG editor, so whenever I change the html editor to the visual editor and get back to the html editor, the text code gets stripped.
FINAL EDIT
Here is my code fully working, this code is supposed to hide/show a text based on the browser address, if you want to use it, just change /free-blogger-templates/ to the current page where you'll run your script, for example, if you're running on yoursitedotcom/myfirstpage, change it to /myfirstpage/$, the $ means it will just allow the url until the foward slash /, I had to use document.write, I know it's not recomended, but that's the only solution I found, here it is:
<script>// <![CDATA[
var regex = new RegExp("/free-blogger-templates/$"); if(document.URL.match(regex)) { document.write('Welcome to Akecheta, the web warrior social network. Here you\'ll find blogger templates, a freelancers area, Question \& Answers Forum. You can even create your own blog to interact with other people. Download Free Blogger Templates, Free Blogger Templates Download, Templates for blogspot blogs, Free download, Free templates for blogspot blogs, Free templates for blogspot blogs download.'); } else { document.write(''); }
// ]]></script>
The text had to be properly converted (Thanks to the user @God is good (Yeah, God is really good =]), then I used http://www.web2generators.com/html/entities to encode the HTML text.
You needed to escape some of your characters. Try this:
var p = document.createElement("p");
p.innerHTML = "Welcome to Akecheta, the web warrior social network. Here you\'ll find blogger templates, a freelancers area, Question \& Answers Forum. You can even create your own blog to interact with other people.<br/><br/>Download Free Blogger Templates, Free Blogger Templates Download, Templates for blogspot blogs, Free download, Free templates for blogspot blogs, Free templates for blogspot blogs download.";
document.body.appendChild(p);
EDIT: The entire code should look like this JSFIDDLE.
这篇关于如何以正确的方式在JavaScript中插入HTML文本？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
