我有一个替换html元素的问题.
例如,这是一个表:
<table>
<tr>
<td id="idTABLE">0</td>
<td>END</td>
</tr>
</table>
(它可以是div,span,任何东西)
和JavaScript中的字符串:
var str = '<td>1</td><td>2</td>';
(它可以是任何东西,123 text,<span>123 element</span> 456或<tr><td>123</td>什么的)
我怎样才能idTABLE用str？替换元素？
所以:
<table>
<tr>
<td id="idTABLE">0</td>
<td>END</td>
</tr>
</table>
变为:
<table>
<tr>
<td>1</td>
<td>2</td>
<td>END</td>
</tr>
</table>
<!-- str = '<td>1</td><td>2</td>'; -->
<table>
<tr>
123 text
<td>END</td>
</tr>
</table>
<!-- str = '123 text' -->
<table>
<tr>
<td>123</td>
<td>END</td>
</tr>
</table>
<!-- str = '<td>123</td>' -->
我试过createElement,replaceChild, …
我是javascript的新手,我刚刚发现了一个我从未见过的javascript行为.如果我有一个带有指定id的DOM元素,比如"x",那么在我的javascript中,该元素会自动分配给变量x.我在chrome和safari中看到了这一点.这是javascript的文档功能吗？
例如:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<form id='x'>
<input type='text' name='info' id='info'/>
<input type='submit' name='submit' value='Complete'/>
</form>
<script type='text/javascript'>
window.onload = function() {
alert( x==document.getElementById('x') );
info.value = 'Test me!';
}
</script>
</body>
</html>
加载后,它会提示为true,输入区域将显示"Test me!".如果这是正确的行为,为什么我们需要document.getElementById呢？
我试图循环div中的输入元素,以创建一个对象数组
<div id="time">
<input type="text" name="from" placeholder="12:00 AM" />
<input type="text" name="to" placeholder="12:30 AM" />
<input type="text" name="from" placeholder="13:00 AM" />
<input type="text" name="to" placeholder="13:30 AM" />
</div>
我正在尝试创建以下对象数组.
unavailability: [
{ from: '12:00', to: '12:30' },
{ from: '13:00', to: '13:30' }
]
这是我到目前为止所尝试的,但结果却截然不同.
var dataArray = []
$("#time").find('input').each(function() {
var data = {};
data[this.name] = this.value
dataArray.push(data);
});
console.log(dataArray)
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="time">
<input type="text" name="from" placeholder="12:00 AM" />
<input type="text" name="to" placeholder="12:30 AM" />
<input type="text" name="from" …例如,我有一个带id="mybox"属性的元素,调用它document.getElementById('mybox')和mybox直接调用它有什么区别,因为我看到它们在大多数浏览器中都一样吗？jsfiddle显示实例 http://jsfiddle.net/usmanhalalit/TmS3k/
如果没有差别那么为什么document.getElementById('mybox')如此受欢迎,mybox直接打电话是不好的做法？
1)问题1
以下示例在不使用"document.getElementById('myId')"的情况下工作.为什么这样,可以跳过"document.getElementById('myId')"？
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Javascript question</title>
<script>
window.onload = function(){
myId.style.color = 'red';
}
</script>
</head>
<body>
<div id=myId>
<p>Make this color red.</p>
</div>
</body>
</html>
2)问题2
我通常存储浏览器对象以减少DOM遍历(参见下面的示例).如果我不将ID存储在变量中,或者它是否已经变量,那么它是否会更多DOM遍历？
window.onload = function(){
var myId = document.getElementById('myId'); /* stored ID that will be used multiple times */
myId.style.color = 'red';
}
谢谢!
可能重复:
IE/Chrome:DOM树元素是全局变量吗？
我在浏览器中偶然发现了一个意外但有用的行为:它为我的html代码中具有ID的每个元素创建一个变量.所以当我有:
<div id="ohlala"> ... </div>
浏览器似乎在幕后运行此代码:
var ohlala = document.getElementById("ohlala");
所以我可以通过以下方式轻松更改该元素的文本:
ohlala.innerHTML="test"
在网上尝试:http://jsfiddle.net/Facby/
问题是:为什么我需要自己写这个document.getElementById()位？该代码的可移植性如何？我在Opera,FireFox和Chrome上试过,它有效!我可以依靠这个功能吗？浏览器是否总是为每个具有id的元素创建变量？在这种情况下,我必须更加小心我的javascript代码中使用的名称不要与HTML中的类似ID冲突,对吧？
我有以下index.html:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript">
</script>
<script type="text/javascript">
jQuery(document).ready(function($) {
console.log(foo); // jQuery assumes foo is an id?
});
</script>
</head>
<body>
<div id="foo">i'm a div</div>
</body>
</html>
控制台输出:
<div id="foo">i'm a div</div>
为什么？
所以我遇到了一个奇怪的问题......我想抓住一个表格的id说:
<form id="test">
<input name="id" type="hidden" value/>
</form>
但是运行document.getElementById("test").id不会test按预期返回,而是返回输入name="id".有谁知道这里发生了什么？
这是一个重现问题的小提琴 - > http://jsfiddle.net/jascbbfu/
我试图使用JavaScript将单击事件附加到复选框.下面显示的是HTML和JS.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<body>
<input type="hidden" name="caution_c" value="0">
<input type="checkbox" id="caution_c" name="caution_c" value="1" tabindex="120">
<script type="text/javascript">
var cb = document.getElementById('caution_c');
cb.onclick = function() {
alert(1);
}
</script>
</body>
</html>
问题是在IE中,click事件不会触发.我缩小了问题的位置.问题是复选框之前有一个隐藏的输入,这两个元素具有相同的名称.我不确定为什么这会导致问题(毕竟,我使用的是getElementById,而隐藏的元素甚至没有id).
这种行为是否有正当理由(仅适用于IE.在Firefox中正常工作......一如既往:()？还有一个很好的解决方法(我可以做document.getElementsByName('caution_c')[1]但我不想...)
可能重复:
IE/Chrome:DOM树元素是全局变量吗？
我最近发现我可以在javascript中使用来自DOM的任何对象,并直接引用它的id:
<div id="layer">IM A LAYER</div>
<script>
alert(layer.innerHTML);
</script>
如果这是真的,我使用getElementById方法有什么好处？