使用javascript按ID删除输入元素答案

【问题标题】：Remove input element by ID with javascript使用javascript按ID删除输入元素
【发布时间】：2023-03-22 07:20:02
【问题描述】：

我已经这样做了，但它似乎不起作用！：

Javascript：

<script>
function hideOptionPhoto(){ 
    var element = document.getElementById("Photo1");
    element.parentNode.removeChild(Photo);   
};

window.onload = function() {
    hideOptionPhoto();
};
</script>

HTML：

<div id=Photo1>
    <input id="Photo" type="image" src="x.png" border="0" name="submit" alt="">
</div>

由于父母和孩子的情况，我将<input> 放在<div> 中。对吗？

【问题讨论】：

即使Photo 引用了input 元素，Photo 也是Photo1 的子元素，而不是Photo1 的父元素。因此element.parentNode.removeChild(Photo); 将不起作用。 Learn how to debug JavaScript.
@maxmitch 您的 HTML 在第一行有语法错误。检查我的答案。包括说明

标签： javascript html input

【解决方案1】：

试试这个。这将起作用

下面的脚本应该放在body标签内

<script>
function hideOptionPhoto(){


var element = document.getElementById("Photo1");
var child=document.getElementById("Photo");
element.removeChild(child);

}
window.onload = function() {
  hideOptionPhoto();
};
</script>

【讨论】：

【解决方案2】：

var element = document.getElementById("Photo"); // notice the change
element.parentNode.removeChild(element);

<div> 是可选的（为此），因为每个元素都有一个 parentNode。但是有 div 可能还有其他原因。

【讨论】：

请参阅工作 jsfiddle。或查看stackoverflow.com/questions/3387427/…
抱歉，我在 Dreamweaver 上使用了实时功能，但似乎无法正常工作。现在把它放到互联网上看看它是否有效！
这是一个非常愚蠢且无关紧要的问题，但除了.onload 之外，还有其他选项可以更早地做到这一点吗？而且它似乎没有工作......很奇怪，因为它显然在 jsfiddle 上工作！我已将其放在 if 语句中，但我认为这不会产生影响？
你在元素后面放了一个小脚本。它不能在此之前执行，否则该元素将不存在，并且您将无法获得对它的引用。

【解决方案3】：

好的。让我发布工作小提琴，我会给出解释。

Working Fiddle

您的代码中有一个“语法错误”。

//Incorrect    
     <div id=Photo1>

//Correct
    <div id="Photo1">

另外检查我的 JavaScript 函数。 函数调用没问题。只是里面的代码错了

您已将 HTML 元素 div(Photo1) 分配给变量 "Element"。 img("photo") 是 Element 的 child，因此可以直接删除。

更重要的一点是您使用的命名约定。你不应该分配像“照片”这样的 ID

HTML

<div id="Photo1">
    <input id="Photo" type="image" src="x.png" border="0" name="submit" alt=""/>
</div>

Javascript

function hideOptionPhoto(){     
    var element = document.getElementById("Photo1");
    var child=document.getElementById("Photo");
    element.removeChild(child);
};

window.onload = function() {
    hideOptionPhoto();
};

【讨论】：

OP 没有使用 XHTML，省略完全由字母组成的属性值周围的引号不是任何类型的错误。
你不应该分配像“照片”这样的 ID — 将“照片”作为 ID 有什么问题？

【解决方案4】：

试试

function hideOptionPhoto(){ 
var element =  document.getElementById('Photo');
if (typeof(element) != 'undefined' && element != null)
  {
    element.remove();
    alert('Deleted');
  }

};

window.onload = function() {
    hideOptionPhoto();
};

<div id=Photo1>
    <input id="Photo" type="image" src="x.png" border="0" name="submit" alt="">
</div>

【讨论】：

【解决方案5】：

<div id="Photo1">
<input id="Photo" type="image" src="x.png" border="0" name="submit" alt="">
</div>

使用这个：

document.getElementById("Photo1").innerHTML = "";

【讨论】：