TOGOUTECH

javascript replaceChild 不起作用

coder 2024-12-09 原文

我是计算机科学专业的学生，​​我们正在用 javascript 做练习，练习是: “用 ID 为“numberFour”且文本为“Mistreatment”的新项目替换项目编号 4。” 这是我做练习之前的样子:

  1. 第一:寻找伴侣
  2. 第二:无聊
  3. 第三:缺乏服从
  4. 第四:虐待
  5. 第五点:寻求伙伴关系

然后我写了这段js代码来完成作业:

var vier = document.createElement("li");
vier.innerHTML = "Number four: Mistreatment";
vier.setAttribute("id", "numberFour");
var lijst = document.querySelector("#fiveReasons");
lijst.replaceChild(vier, lijst.childNodes[3]);

然后它看起来像这样:

  1. 第一:寻找伴侣
  2. 第二:无聊
  3. 第四:虐待
  4. 第四:虐待
  5. 第五点:寻求伙伴关系

所以我将我的代码更改为:

var vier = document.createElement("li");
vier.innerHTML = "Number four: Mistreatment";
vier.setAttribute("id", "numberFour");
var lijst = document.querySelector("#fiveReasons");
lijst.replaceChild(vier, lijst.childNodes[4]);

然后我得到了这个:

  1. 第一:寻找伴侣
  2. 第二:无聊
  3. 第三:缺乏服从
  4. 第四:虐待
  5. 第四:虐待
  6. 第五点:寻求伙伴关系

我的老师不明白为什么它不起作用，我也不明白，有人可以帮助我吗？

最佳答案

childNodes 包含 li 元素之间空白的文本节点(以及注释节点，如果有的话，等等)。如果您只想要子元素，请使用children:

var vier = document.createElement("li");
vier.innerHTML = "Number four: Mistreatment - updated";
vier.setAttribute("id", "numberFour");
var lijst = document.querySelector("#fiveReasons");
lijst.replaceChild(vier, lijst.children[3]);
<ol id="fiveReasons">
    <li>Number one: Looking For a Mate</li>
    <li>Number two: Boredom</li>
    <li>Number three: Lack of Obedience</li>
    <li>Number four: Mistreatment</li>
    <li>Number five: Seeking Companionship</li>
</ol>

children 适用于所有现代浏览器和 IE8。

关于javascript replaceChild 不起作用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/27481491/

replaceChildjavascriptlicodesection

有关javascript replaceChild 不起作用的更多相关文章

  1. javascript - jQuery Bootstrap ScrollSpy 不起作用 - 2

    我正在尝试使用ScrollSpyBootstrap插件，但它无法正常工作。请参阅下面的代码，它始终突出显示最后一项。http://jsfiddle.net/bRYMC/Page1Page2Page3Page4Page5Page1Page2Page3Page4Page5你能帮帮我吗？ 最佳答案 在body标签上设置data-spy="scroll"，它应该可以工作。请检查更新的jsFiddle. 关于javascript-jQueryBootstrapScrollSpy不起作用，我们在St

  2. javascript - 同一页面上的 jQuery 和 javascript 代码不起作用 - 2

    我对jQuery和javascript代码有疑问；当我在之间写下这个jQuery时和var$j=jQuery.noConflict();$j(document).ready(function(){$j('#page_effect').fadeIn(3000);});然后在body标签中写javascript代码bubblesMain(newObject({type:'linear',minSpeed:100,maxSpeed:400,minSize:30,maxSize:55,num:100,colors:newArray('#FF0000','#FFFFFF','#FFCC99','

  3. javascript - 图像上传部分中的跨浏览器图像预览在 ie8 中不起作用 - 2

    我网站上传图像部分的图像预览在IE8+浏览器中不工作。但在IE7和IE6中工作正常。我正在使用下面的代码来实现图像预览功能。JS:varloadImageFile=(function(){if(window.FileReader){varoPreviewImg=null,oFReader=newwindow.FileReader(),rFilter=/^(?:image\/bmp|image\/cis\-cod|image\/gif|image\/ief|image\/jpeg|image\/jpeg|image\/jpeg|image\/pipeg|image\/png|image\

  4. javascript - Reveal.js 多路复用不起作用 - 2

    我遵循以下链接中的示例:https://github.com/hakimel/reveal.js#multiplexing，但不知何故，多路复用不起作用——当母版幻灯片更新时，客户端不会更新。我已经在reveal.js演示socket.io服务器上进行了尝试，并尝试托管我自己的服务器。这些选项都不起作用，而且我很确定我已经正确配置了它们。这是我的配置代码:master/index.htmlReveal.initialize({controls:true,progress:true,history:true,center:true,multiplex:{id:'e2bc6e79f19fb

  5. javascript - Jquery $(element).contents().first().text ("new text") 不起作用？ - 2

    我在Google或此处找不到任何相关信息。我有一个div，里面有一些文本和一些html:http://somewebsite.com/big/long/unfriendly/path/我想做的是添加一个在每个斜线之后。(因为该值不会以其他方式换行并弄乱了我的表格)。在$('#test-div').html()上做一个简单的替换也会与强标签混淆，所以这不是一个选项。我想使用$('#test-div').contents()过滤掉文本部分(递归地)会起作用。但是我似乎无法编辑返回的各个位。我希望这会改变http://部分:$('#test-div').contents().first().

  6. javascript - 将 jQuery 变成 Angular，修复侧边栏不起作用(？) - 2

    我正在将jQuery插件转换为Angular指令，但仍然无法正常工作，或者:根本无法工作。ThisisthebehaviorIwanttoachieveHereisajsfiddlealso请记住，我想要通过此实现的是左侧边栏上到处都显示“粘性”的行为。我是用jQuery做的(我是Angular的新手)，我需要让它与Angular一起工作。请去看看PlunkrExample，那种行为，就是我想要的。如果你们中的一些人花时间帮助我，请提前致谢。查看jQuery代码:$(function(){varoffset=$("#sidebar").offset();vartopPadding=85

  7. javascript - 局部作用域对象 - 2

    我很好奇JavaScript中是否存在“局部作用域对象”之类的东西。如果你调用一个函数，它有一个上下文(this)，这是它被调用的对象(functionf(){returnthis;};obj.f=f;obj.f();//返回obj;)和一个在每次函数调用时创建的作用域。作用域用于定义局部变量，如下例所示:varglobalScopeVar=1;(function(){varlocalScopeVar=2;})();在这两个范围内，this指的是全局上下文(通常是window)，因为该函数尚未在任何对象上调用。不过，我感兴趣的是“范围对象”，即定义范围内变量的对象。对于全局范围，这通常

  8. javascript - 即使状态为 200，WNS 推送通知也不起作用 - 2

    我正在通过WNS和WINJS(windowsPhone8.1)处理推送通知。我关注了这篇文章https://msdn.microsoft.com/en-us/library/windows/apps/hh465460.aspx.现在我无法在我的设备上接收推送通知，但WNS服务器以状态200和收到的消息回答我HTTP/1.1200OKContent-Length:0X-WNS-DEVICECONNECTIONSTATUS:connectedX-WNS-NOTIFICATIONSTATUS:receivedX-WNS-STATUS:receivedX-WNS-MSG-ID:77B35991

  9. javascript - 如果 "this"为空字符串，则 Handlebars 中的 {{#each this}} 不起作用 - 2

    考虑我的json是这样的:{main:{"":[{some_obj},{some_obj}]},secondary:{"key":[{some_obj},{some_obj}]}}现在我的第一个#each将运行在主要和次要的地方。{{#eachthis}}--Thisisformainandsecondary--{{#eachthis}}--Thisisfor""incaseofmainand"key"incaseofsecondary--{{/each}}{{/each}}如果“this”为空，如我的“main”属性的json中所示，我的嵌套#each将不起作用

  10. javascript - 当用户使用键盘时，Knockout.js valueUpdate 不起作用 - 2

    我正在使用Knockout.js和ASP.NET。我的HTML如下:Fixed/Floating如果用户使用鼠标选择项目，JSON会返回服务器并更新信息。但是，如果用户使用“tab”切换到选择控件，选择一个项目，然后关闭，那么即使所选项目显示在UI上，JSON也会返回此控件的空白值。如果用户仅使用键盘，KnockoutView模型似乎不会更新，当用户使用鼠标时，浏览器中似乎会发生一些特定的更改事件。我该如何解决这个问题？有没有办法可以注册选择框onchange事件以使用手动更新Knockout模型的功能？我在IE9和Firefox中都试过了，我在这两个中都遇到了同样的问题。

随机推荐