innerhtml 相关问题

innerHTML是DOM节点的属性，用于获取或设置HTML元素的内部HTML代码。它通常用于Javascript中以动态更改或从页面读取。

javascript onclick innerhtml caption

回答 1 投票 0

为什么 rowcount = x 为什么 ${rowcount + 1} 总是显示 1？

我想按名称传递值 c_lastname31_2 c_lastname31_3 c_lastname31_4 但它总是 c_lastname31_1 函数 addRow() { const tableBody = document.querySelector("表 tbody"); //

javascript innerhtml thread-local-storage

回答 2 投票 0

JavaScript：rowcount = x 为什么 ${rowcount + 1} 总是显示 1

我想按名称传递值 c_lastname31_2 c_lastname31_3 c_lastname31_4 但它总是 c_lastname31_1 函数 addRow() { const tableBody = document.querySelector("表 tbody"); //

javascript innerhtml thread-local-storage

回答 1 投票 0

java脚本：rowcount = x为什么${rowcount + 1}总是显示1

我想按名称 c_lastname31_2 c_lastname31_3 c_lastname31_4 传递值，但它总是 c_lastname31_1 函数 addRow() { const tableBody = document.querySelector("table tbody");...

javascript innerhtml thread-local-storage

回答 1 投票 0

如何追加到innerHTML而不是替换其内容

我知道我们可以更改内容，例如，你好使用： document.getElementById("whatEverId").innerHTML="你好二"; 难道是…… 我知道我们可以更改的内容，例如， <div id="whatEverId">hello one<div> 通过使用： document.getElementById("whatEverId").innerHTML="hello two"; 有没有办法（使用 .innerHTML()）我可以向 div 添加内容而不是替换它？所以我可以得到，例如， <div id="whatEverId">hello one hello two<div> 使用 += 赋值运算符: <div id="whatever">hello one</div> <script> document.getElementById("whatever").innerHTML += " hello two"; </script> 请注意，使用 element.innerHTML += 'content' 会将 input 和 textarea 清空至默认的空白状态，取消单击复选框，并删除附加到这些元素的任何事件（例如 onclick、on hover 等）。）因为整个 innerHTML 会被浏览器重新解释，这意味着.innerHTML 被清空并再次从头开始填充合并的内容。如果需要保留状态，则需要创建一个新元素（例如 <span>）并将其附加到当前元素，如下所示： let newElement = 'span' newElement.innerHTML = 'new text' document.getElementById('oldElement').appendChild(newElement) document.getElementById("whatEverId").innerHTML = document.getElementById("whatEverId").innerHTML + "hello two" + document.getElementById("whatEverId").innerHTM ; jcomeau_ictx 建议的是一种低效的编辑 insideHTML 的方法。查看 Ben Cherry 的 PPT http://www.bcherry.net/talks/js-better-faster 正确的方法是分离元素并对其进行更改，然后将其附加回父节点。使用此要点中的 https://gist.github.com/cowboy/938767 原生 JavaScript 来分离元素。如果要追加，只需将 = 更改为 += document.getElementById("whatEverId").innerHTML += '你好二'; 如果加前缀 document.getElementById("whatEverId").innerHTML = '你好二' + document.getElementById("whatEverId").innerHTML; 尽管我强烈建议使用 jQuery 或 MooTools javascript 库/框架来完成此类事情。如果您要添加标签而不仅仅是文本节点，那么您应该使用 DOM createElement 或上述库/框架之一。你可以通过像这样附加 div 字符串来做到这一点.. document.getElementById('div_id').innerHTML += '你好二';

javascript dom innerhtml

回答 6 投票 0

使用XHTML替换innerHTML中的字符串

所以，这是我试图完成的一件相当简单的事情（javascript），但它花了我很长时间而且仍然不起作用。我正在尝试替换某些单词（位于预标记内）。例如...

javascript xhtml replace innerhtml

回答 1 投票 0

为什么我的innerHTML在替换后就消失了？

我正在尝试使用 .innerHTML 和 .replace 替换一些 HTML。从： aaaaaa/猫/bbbbbb 到：你好世界这是我的代码：我正在尝试使用 .innerHTML 和 .replace 替换一些 HTML。来自： aaaaaa/cat/bbbbbb 致： <a href="http://www.google.com/cat/world">Helloworld</a> 这是我的代码： <body> <p id="element1">aaaaaa/cat/bbbbbb</p> <script language="javascript"> var strMessage1 = document.getElementById("element1") ; strMessage1.innerHTML = strMessage1.innerHTML.replace( /aaaaaa./g,'<a href=\"http://www.google.com/') ; strMessage1.innerHTML = strMessage1.innerHTML.replace( /.bbbbbb/g,'/world\">Helloworld</a>') ; </script> </body> 当我运行此代码时，它会使 Helloworld 超链接消失。我做错了什么？您应该将replace()链接在一起，而不是分配结果并再次替换。 var strMessage1 = document.getElementById("element1") ; strMessage1.innerHTML = strMessage1.innerHTML .replace(/aaaaaa./g,'<a href=\"http://www.google.com/') .replace(/.bbbbbb/g,'/world\">Helloworld</a>'); 参见演示。您正在替换起始标记，然后将其放回 innerHTML，因此代码将无效。在将代码放回元素之前进行所有替换： var html = strMessage1.innerHTML; html = html.replace( /aaaaaa./g,'<a href=\"http://www.google.com/'); html = html.replace( /.bbbbbb/g,'/world\">Helloworld</a>'); strMessage1.innerHTML = html;

javascript html innerhtml

回答 2 投票 0

如何从Javascript中的insertAdjacentHTML对象中删除不需要的逗号（，）？ [重复]

我将项目列表数据保存在一个数组中，并映射该数组以在 UI 中显示列表，我使用 .insertAdjacentHTML()，并且项目列表在 UI 中运行良好，除了我得到了不需要的

javascript html arrays innerhtml insertadjacenthtml

回答 1 投票 0

Javascript onclick 事件不适用于innerHTML+=any

按钮单击事件在 JavaScript 中不起作用。我有一个带有框 id 的 div。当我尝试为每个按钮分配 onclick 时，只有最后一个按钮可以正常工作，其他按钮不起作用。另外，...

javascript html innerhtml

回答 1 投票 0

JavaScript - 当这些值相同时，如何使用 print 函数输出存储在数组中的 2 个值？

var 学生 = [ { 姓名：“戴夫”，轨道：“前端开发”，成就：158，积分：14703 }, { 姓名：“乔迪”， track : “使用 swift 进行 iOS 开发”, 成就：...

javascript arrays innerhtml

回答 1 投票 0

innerHTML 未按预期工作

我到处寻找解决这个问题的方法，但我无法解释。每当我使用 javascript 的innerHTML 注入以下字符串时，问题就在这里：例子： var s = "&l...

javascript html innerhtml

回答 1 投票 0

为什么将标记分块附加到innerHTML 与一次附加所有内容的行为不同？

为了更好地理解我的问题，这里有一个简短的例子，我的 HTML 有以下内容， varparent = document.getElementById("parent"); parent.innerHTML += ""; Parent.innerHTML += "<... 为了更好地理解我的问题，这里有一个简短的例子，我的 HTML 如下， var parent = document.getElementById("parent"); parent.innerHTML += "<ul>"; parent.innerHTML += "<li>Hello</li>"; parent.innerHTML += "</ul>"; console.log(parent.outerHTML); <div id="parent"></div> 我期待收到类似的输出 <div id="parent"><ul><li>Hello</li></ul></div> 但是我收到的输出如下， <div id="parent"><ul></ul><li>Hello</li></div> 如您所见，<ul>标签没有包含<li>标签。我知道我可以使用 appendChild 来解决我的问题，但我真的很好奇为什么会发生这种情况。有什么想法吗？如果您完全不添加</ul>，也会发生相同的结果。当您第一次追加到 <ul> 以保持代码有效时，innerHTML 标签已关闭。如果您将字符串组装为变量并附加一次，它就会起作用： var tmp = "<ul>"; tmp += "<li>Hello</li>"; tmp += "</ul>"; parent.innerHTML = tmp; 我猜测您添加的字符串<ul>让浏览器自动添加了</ul>，以便该语句有意义。然后下一行添加了<li>hello</li>，这很好。然后浏览器拒绝了</ul>，因为由于<ul>已经关闭了，所以没有意义。我做了一些实验，这就是我想到的，当我编写时，parent.innerHTML += "<ul>";浏览器检测到没有结束标记，因此添加“”作为错误更正。当浏览器出现 'parent.innerHTML += </ul>' 时，它会发现没有起始标签，因此会忽略它。如果您尝试以下代码，您将不会看到该问题。 var parent = document.getElementById("parent"); function myFun(parent){ var html = "<ul>"; html += "<li>Hello</li>"; html += "</ul>"; parent.innerHTML += html ; } 由于浏览器对 html 的宽容性质，当您仅将添加到 innerHTML 时，它就添加了（换句话说，是一个有效元素）。然后添加Hello，就可以了。最后的会被浏览器忽略，因为它看不到需要。

javascript html innerhtml

回答 4 投票 0

为什么操作innerHTML会破坏内部DOM节点的身份？

我在 DOM 元素引用方面遇到了一些问题，我想我已经追踪到它与更新 innerHTML 有关。在此示例中，在第一个警报时，两个变量引用...

javascript dom innerhtml

回答 2 投票 0

我必须关闭所有写入innerHTML属性的标签吗？

所以假设我有这个元素： ... ... 然后我有一个像这样的脚本： var me = document.getElementById("me"); me.innerHTML = ' 所以假设我有这个 <div> 元素： ... <div id="me"></div> ... 然后我有一个这样的脚本： var me = document.getElementById("me"); me.innerHTML = '<span color="#00F">Hello!'; 这个脚本是否是一个糟糕的“黑客”，为什么我必须写/我什至必须写： me.innerHTML = '<span color="#00F">Hello!</span>'; ，结尾是</span>？像'<span color="#00F">Hello!';那样插入html是不好的做法，尽管主要浏览器会自动添加结束标签。为了始终保持一致，请用结束标记包裹 html。来自评论：那么如果浏览器自动添加结束标签为什么会不好呢？首先，你强迫浏览器做这件事，这是耗时的，其次并不是所有浏览器都应该这样工作。有效的 HTML 是可预测的，因此它是健壮且可靠的。 HTML 标签汤取决于每个浏览器应用的具体修复，因此可能导致不一致并且难以诊断错误。

javascript html dom innerhtml

回答 2 投票 0

如何将字符一一追加到innerHTML，同时确保HTML标签被正确解释？

作为较大脚本的一部分，我一直在尝试制作一个页面，该页面将从另一个函数获取文本块并将其“键入”到屏幕上：函数 typeOut(页,nChar){ 瓦...

javascript html innerhtml

回答 2 投票 0

innerHTML 属性有什么用？

innerHTML 属性用于更改 HTML 元素内的文本。这是innerHTML 唯一能做的事情吗（或者）还有其他用途吗？

javascript html dom innerhtml

回答 2 投票 0

如何使用innerHTML显示文本

例如，如果我想像这样并排显示来自javascript的文本文字1 文字2 文字3 所以我输入了这段代码 <question vote="-1"> <p>例如，如果我想像这样并排显示来自 javascript 的文本</p> <blockquote> <p>文字1 文字2 文字3</p> </blockquote> <p>所以我输入了这段代码</p> <pre><code><p id=displayText> <p> <script type="text/javascript"> function doSomeThing() { //do something document.getElementById("displayText").innerHTML=text1; //do something document.getElementById("displayText").innerHTML=text2; //do something document.getElementById("displayText").innerHTML=text3; } </script> </code></pre> <p>我只有</p> <blockquote> <p>文字3</p> </blockquote> <p>我该怎么做。</p> </question> <answer tick="false" vote="2"> <p><pre><code>+=</code></pre> 与非标准属性 <pre><code>innerHTML</code></pre> 一起使用时可能会出现问题。</p> <p>您可以通过使用额外的变量来避免在 <pre><code>+=</code></pre> 上使用 <pre><code>innerHTML</code></pre>：</p> <pre><code>function doSomeThing() { var progress = ""; //do something progress += text1; document.getElementById("displayText").innerHTML = progress; //do something progress += text2; document.getElementById("displayText").innerHTML = progress; //do something progress += text3; document.getElementById("displayText").innerHTML = progress; } </code></pre> 如果您这样做，<p><pre><code>+=</code></pre>就会有问题：</p> <pre><code>e.innerHTML += '<a href="#">foo'; e.innerHTML += 'bar'; e.innerHTML += '</a>'; </code></pre> <p>实际输出的 HTML 将为 <pre><code><a href="#">foo</a>bar</code></pre>。这是怎么发生的？好吧，当您将 innerHTML 设置为 <pre><code><a href="#">foo</code></pre> 时，浏览器会尝试为您“修复”它，因此它会添加 <pre><code></a></code></pre> 以使其有效。</p> <hr/> <p>还有一些方法可以通过使用适当的 DOM API <pre><code>innerHTML</code></pre> 等来完全避免使用 <pre><code>document.createElement()/createTextNode()</code></pre> </p> </answer> <answer tick="false" vote="1"> <pre><code><p id=displayText> <p> <script type="text/javascript"> function doSomeThing() { var para = document.getElementById('displayText'); para.innerHTML = para.innerHTML + text1; para.innerHTML = para.innerHTML + text2; para.innerHTML = para.innerHTML + text3; } </script> </code></pre> </answer> <answer tick="false" vote="0"> <p>您将文本设置为相同的 ID。创建 3 个 ID，而不是只有一个。</p> <p>做这个或那个：</p> <pre><code>function doSomeThing() { //do something document.getElementById("displayText").innerHTML = text1; //do something document.getElementById("displayText").innerHTML += (" "+text2); //do something document.getElementById("displayText").innerHTML += (" "+text3); } function doSomeThing() { //do something document.getElementById("displayText1").innerHTML = text1; //do something document.getElementById("displayText2").innerHTML = text2; //do something document.getElementById("displayText3").innerHTML = text3; } //HTML ? <span id="displayText1"></span> <span id="displayText2"></span> <span id="displayText3"></span> </code></pre> </answer> <answer tick="false" vote="0"> <p>仅搜索一次元素，并将值作为数组传递（更动态且限制更少）。</p> <pre><code><html> <head> <script> function doSomeThing(v){ var tE = document.getElementById('displayText'); if (tE) tE.innerHTML = (v || []).join(' '); } </script> </head> <body onload = "doSomeThing(['text1', 'text2', 'text3'])"> <span id = 'displayText'></span> </body> </html> </code></pre> </answer> </body></html>

javascript innerhtml

回答 0 投票 0

innerHTML 无法在任何浏览器中工作CSS 演示

CSS 演示 &...</desc> <question vote="0"> <pre><code><!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>css demo</title> </head> <script src="http://code.jquery.com/jquery-1.9.1.js"></script> <script> (function(){ var html = '<p>'; html += 'Hello World'; html += '</p>'; $(document.body).innerHTML = html; //document.body.innerHTML = html; }) </script> <body> </body> </html> </code></pre> <p>$(document.body).innerHTML = html; // jQuery 也不起作用。文档.body.innerHTML = html; // 普通 JS 尝试查询 DOM 也不起作用。</p> <p>这里的实际问题是什么？我知道在使用 jQuery 时我们不需要使用 innerHTML 来附加 HTML 内容，只是在尝试和学习它。</p> </question> <answer tick="true" vote="6"> <p>你需要获取dom元素，<pre><code>$(document.body)</code></pre>返回一个jQuery包装的元素，它没有<pre><code>innerHTML</code></pre>属性</p> <pre><code>$(document.body).get(0).innerHTML = html; </code></pre> <p>或者简单</p> <pre><code>document.body.innerHTML = html; </code></pre> <p>使用 jQuery</p> <pre><code>$('body').html(html) </code></pre> <p>而且看起来匿名函数没有被调用</p> <pre><code>(function(){ var html = '<p>'; html += 'Hello World'; html += '</p>'; document.body.innerHTML = html; })() </code></pre> <p>如果你需要等待 dom 准备好那么</p> <pre><code>jQuery(function($){ var html = '<p>'; html += 'Hello World'; html += '</p>'; $('body').html(html) }) </code></pre> </answer> <answer tick="false" vote="2"> <p>最简单的方法是<pre><code>html()</code></pre></p> <pre><code> $('body').html(html); </code></pre> <p><a href="http://jsfiddle.net/fRUUd/1499/" rel="nofollow"><strong>工作演示</strong></a></p> </answer> <answer tick="false" vote="2"> <p>使用 jQuery 的 <a href="http://api.jquery.com/html/" rel="nofollow"><pre><code>$.html()</code></pre></a> 函数 :</p> <blockquote> <p>此方法<strong>使用浏览器的innerHTML属性</strong>。某些浏览器可能会不返回完全复制原始 HTML 源的 HTML 文档。例如，Internet Explorer 有时会忽略如果属性值仅包含字母数字，则用引号引起来角色。</p> </blockquote> <pre><code>var html = '<p>'; html += 'Hello World'; html += '</p>'; $(document.body).html(html); </code></pre> <p>活生生的例子：<a href="http://jsfiddle.net/YTaRG/" rel="nofollow">http://jsfiddle.net/YTaRG/</a></p> </answer> <answer tick="false" vote="1"> <pre><code> (function(){ var html = '<p>'; html += 'Hello World'; html += '</p>'; $("body").html(html); //document.body.innerHTML = html; }) </code></pre> </answer> <answer tick="false" vote="1"> <p>实际上浏览器在加载之前运行您的脚本。你必须设置一个计时器或添加 onDomReady 事件</p> </answer> <answer tick="false" vote="1"> <p>由于您使用的是 jQuery，因此您也可以通过 jQuery 方式执行此操作：</p> <pre><code>$(function(){ var html = '<p>'; html += 'Hello World'; html += '</p>'; $('body').html(html); }); </code></pre> <p><a href="http://jsfiddle.net/k4psh/" rel="nofollow">JSFiddle</a></p> </answer> <answer tick="false" vote="1"> <p>你忘记了一件事：</p> <pre><code>(function(){ }); </code></pre> <p>这不会运行，你应该这样做：</p> <pre><code>$(function() { //... //and then... $('body').html(html); }); </code></pre> <p>当你使用 jQuery 选择一个元素时，jQuery 会为其添加一个数组包装器，因此如果你想同时使用 jquery 选择器和原生 JavaScript html，你应该这样做：</p> <pre><code>$(document.body)[0].innerHTML = html; </code></pre> </answer> <answer tick="false" vote="1"> <p>这样做</p> <pre><code><script> $(document).ready(function(){ var html = '<p>'; html += 'Hello World'; html += '</p>'; $('body').html(html); }) </script> </code></pre> </answer> <answer tick="false" vote="1"> <p>将 <pre><code>$(document.body).innerHTML = html;</code></pre> 更改为 <pre><code>$(document.body).html(html);</code></pre>，这是使用 jQuery 执行此操作的正确方法。</p> <p>或</p> 如果您不想使用 <p><code>$(document.body).innerHTML = html;</code><pre> 方法，</pre>将 <pre><code>$(document.body)[0].innerHTML = html;</code></pre> 更改为 <pre><code>html()</code></pre>。</p> </answer> <answer tick="false" vote="0"> <p>那个自执行函数不太正确，你需要将最后一行更改为：</p> <pre><code>})(); </code></pre> <p>但即使你修复了这个问题，因为脚本位于开始 body 标记之前，所以它会在 DOM 中构造 body 之前运行。如果您观察控制台，您会看到类似“无法设置 null 属性‘innerHTML’”的异常。将脚本移入正文将解决此问题。</p> <p>所以这是原生 JS 版本：</p> <pre><code><!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>css demo</title> </head> <body> <script> (function(){ var html = '<p>'; html += 'Hello World'; html += '</p>'; document.body.innerHTML = html; })(); </script> </body> </html> </code></pre> <p>然后这是一个 jQuery 版本：</p> <pre><code><!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>css demo</title> </head> <body> <script src="jquery.js"></script> <script> (function(){ var html = '<p>'; html += 'Hello World'; html += '</p>'; $('body').html(html); })(); </script> </body> </html> </code></pre> </answer> </body></html>

javascript jquery innerhtml

回答 0 投票 0

innerHtml 不适用于 Div

我在这里制作一个网站，主页上有圆形div。现在，我已将 javascript 设置为缩小它们的大小，并在窗口宽度低于 743 像素时重新定位它们。我也想要...

javascript dom innerhtml

回答 1 投票 0

innerHTML 不起作用，为什么？

我想在跨度中设置新的， var email ='ss@ww.net'; document.getElementById('spanEmail').innerHTML=' 我想在跨度中设置新的， var email ='[email protected]'; document.getElementById('spanEmail').innerHTML='<a class="f14 bold rose" href="mailto:'+email+'>'+email+'</a>'; 但是这种方式不起作用，但是这种方式有效 document.getElementById('spanEmail').innerHTML='sample text>'; 如何替换这个跨度内容？您尚未使用双引号关闭 href 属性。 href="mailto:'+email+'> 应该是 href="mailto:'+email+'"> 您缺少结束语“代码应为： document.getElementById('spanEmail').innerHTML='<a class="f14 bold rose" href="mailto:'+email+'">'+email+'</a>';

javascript html innerhtml

回答 2 投票 0

innerhtml 相关问题

最新问题