我需要帮助DOM中的javascript

我想创建一个窗体，给用户3个不同的选项来更改页面的背景颜色。当用户点击其中一个选项时，背景颜色会更改为匹配。并且还会创建一个带有一些基本文本的div以开始。创建一个具有textarea的表单。使用document.getElementById（'yourelementid'）来查找textarea的值并更改在div中创建的基本文本。（提示：用户innerHTML）现在我知道如何做表单，但是我不知道如何在用户点击该按钮时改变背景。我并不真正了解如何使用innerHTML。如果有人能够解释或给我一些关于如何理解这一点的网站。谢谢。我需要帮助DOM中的javascript

好了，这是我到目前为止，我没有再还理解它...

<!DOCTYPE html PUBLIC "-//W3C//DTD Xhtml 1.0 Strict//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
    <html xmlns="http:www.w3.org/1999/xhtml"> 
    <head> 
    <title>background-color</title> 
    <meta http-equiv="content-type" content="text/html;charset=iso-8859-1" /> 
<script language="javascript" type="text/javascript"> 
    function changeBackgroundColor(objDivID) 

    { 
    var backColor = new String(); 

     backColor = document.getElementById(objDivID).style.backgroundColor; 
    if(backColor.toLowerCase()=='#A20000C') 

    { 
    document.getElementById(objDivID).style.backgroundColor = '#DF64BD'; 

    } 
    else 
     { 
    document.getElementById(objDivID).style.backgroundColor = '#FFDD73'; 
     } 

    } 

     </script> 
     </head> 
     <body> 
     <h3>Change background color to:</h3> 
     <div id="div1" style="background-color : #A2000C"> 
     <p><input type="radio" name="color" value="red" />Red<br /> 
     <input type="radio" name="color" value="pink" />Pink<br /> 
     <input type="radio" name="color" value="yellow" />Yellow<br /> 

     </div> 
    <input type="button" value="click here"onclick="changeBackgroundColor('div1')" /> 
     </body> 
     </html>

我仍然不知道为什么我的盒子AINT那么大，不chaning颜色正确的，我仍然有也有一个盒子。要求更改颜色的文字。

来源

2011-04-15 norris1023

好吧，所以我得到这个权利，你可以使用选择作为股利或这是正确的... – norris1023 2011-04-15 15:14:29

您应该换色选项添加事件处理程序，像这样（假设它是一个选择框）：

<select id="colorSelect"> 
    <option value="red">red</option> 
    <option value="green">green></option> 
</select> 

document.colorSelect.onchange = function(){ 
    document.elementToChangeColor.style.backgroundColor= this.value; 
}

来源

2011-04-15 13:23:46

innerHTML的基本上是两个标记之间的一切（因此内部HTML）：

<div>

现在改变的背景下，你会从表单元素中获得的价值，然后写这样的事情改变背景颜色。

document.getElementById('your_element_id').style.backgroundColor = formElementValue

来源

2011-04-15 13:20:28 locrizak

这里是你如何将网页的背景颜色设置为文本区域的值：

document.bgColor=document.getElementById('yourelementid').value;

来源

2011-04-15 13:20:28 derek

好吧，我确实有这个权利然后......我只是很迷茫和困惑，它甚至不好笑。我明白我必须做的大部分事情，但把它放在一个功能，以便它的工作。我只是迷失了。 – norris1023 2011-04-15 13:23:47

Mozilla文档很好地描述了innerHTML。您可能需要阅读该页面。

DOM对象的innerHTML属性以文本形式提供该对象的HTML内容。所以，如果你有HTML：

<div id="myID"><span>Some text here!</span></div>

和JavaScript：

var theHTML = document.getElementById('myID').innerHTML; 
alert(theHTML);

然后你会看到<span>Some text here!</span>。

如果将innerHTML属性设置为HTML字符串，它将更改该值的内容。考虑到，如果你有以下的JavaScript上面的HTML：

var myDiv = document.getElementById('myID'); 
myDiv.innerHTML = '<span>Now this is some other text</span>';

您与ID myID将改为显示包含跨度格“现在，这是其他一些文字”。

要更改背景颜色，请查看更改正文的CSS属性。 This question将帮助你看到如何做到这一点。您需要调查document.body.style。

来源

2011-04-15 13:23:52 justkt

我会使用jQuery：

function selectionMade(color) { 
    var body = $('body'); 
    body.css('background-color', color) 

    var divWithSomeText = $('<div/>').Text = 'Some Text'; 
    body.Add(divWithSomeText); 
}

jQuery让你正在尝试做的非常容易的事情。如果我是你，我现在就可以使用图书馆，以便将来再次使用它。

来源

2011-04-15 17:05:15 QueueHammer

我需要帮助DOM中的javascript

回答

相关问题