基本上我想在DIV的内容发生变化时执行脚本.由于脚本是独立的(chrome扩展和网页脚本中的内容脚本),我需要一种方法来简单地观察DOM状态的变化.我可以设置投票,但这似乎很草率.
如果div中的内容发生变化,有没有办法观看?
比方说我有:
<div id="hello"><p>Some content here</p></div>
Run Code Online (Sandbox Code Playgroud)
在5秒后的某个时间点变为:
<div id="hello"><ul><li>This is totally different!</li></ul></div>
Run Code Online (Sandbox Code Playgroud)
如何通过回调或其他方式通知此事?在大多数情况下,我可以获取正在插入的javascript,告诉我.但我想知道它是否可能.
由于w3c将DOM变异标记为已弃用(请参阅http://www.w3.org/TR/DOM-Level-3-Events/#events-mutationevents),是否有(快速)替代方法来检测属性修改在DOM?
我正在用内部控件动态创建几个div.其中两个控件应该是datepickers.但由于某种原因,它们没有显示(只显示输入文本)如果我创建静态html,它会起作用,但是当我使用动态html时则不行.
这是我用来生成HTML的代码(我可以看到div)
var ShowContainerDiv = document.createElement('DIV');
var btnShowDiv = document.createElement('DIV');
btnShowDiv.id = 'btnShowDiv ';
btnShowDiv.title = 'Change';
btnShowDiv.index = 120;
var lblShow = document.createElement('label')
lblShow.htmlFor = "btnShowDiv";
lblShow.appendChild(document.createTextNode('Show'));
btnShowDiv.appendChild(lblShow );
btnShowDiv.onclick = function () {
dropdown.style.visibility = "visible";
};
var dropdown = document.createElement('DIV');
dropdown.style.backgroundColor = 'white';
dropdown.style.borderStyle = 'solid';
dropdown.style.borderWidth = '2px';
dropdown.style.cursor = 'pointer';
dropdown.style.textAlign = 'left';
dropdown.style.width = '150px';
var chkRed = document.createElement("input");
chkRed.type = "checkbox";
chkRed.id = "chkRed";
chkRed.value = "Red";
chkRed.checked = false;
var lblRed = …Run Code Online (Sandbox Code Playgroud) 我重写了一些代码,因为检查javascript变量是否发生变化是不可行的.但是,我如何使用dom元素呢?例如
<div id='foo'>123</div>
<script>
$('#foo').html('456');
// function gets fired since #foo changed.
</script>
Run Code Online (Sandbox Code Playgroud)
我试过了
$("#foo").change(function () {
alert('change!');
})
.change();
Run Code Online (Sandbox Code Playgroud)
但没有运气.
假设我有一个给定的HTML元素,例如:
<div id="foo">...</div>
Run Code Online (Sandbox Code Playgroud)
该元素里面,很多事情都可能发生,这将改变该元素的一些显示配置,如高度或固定的位置.
无论如何我可以跟踪与该元素显示相关的任何变化吗?当元素更改任何显示变量时是否会触发一般事件?
是否有(良好)方法来跟踪HTML元素的所有更改?
我尝试使用javascript与jQuery但它不起作用.
$('div.formSubmitButton input[type="submit"]').change(function(event){
alert(event);
});
Run Code Online (Sandbox Code Playgroud)
不知何故,在提交按钮上设置了一个样式属性,但我无法找到它的位置和方式.
如何检测文档何时更改?
我知道我可以这样做:
var lastHTML = document.body.innerHTML;
setInterval(function() { if(document.body.innerHTML != lastHTML) { DOMupdated() } }, 500);
Run Code Online (Sandbox Code Playgroud)
但是有没有我可以放置的事件处理程序,比如onchange?