继续检查Div是否包含特定文本
[英]Keep checking If Div contains specific text
问题描述
Hello So I want to keep checking a function and if a div contains a specific text here is what I have so far but it doesn't seem to be working any ideas? 
您好，所以我想继续检查一个函数，如果一个div包含特定文本，这是我到目前为止的内容，但是似乎没有任何作用？
JS JS
var interval = 500;
var timer = window.setInterval(function() {
var text = $('.text-split-original').text();
var checkText = '4) PLACEHOLDER '
if(text == checkText){
alert("It has this text");
//do something
};
}, interval);
HTML 的HTML
<div class="sar__label">
<div class="text-split-original">
4) PLACEHOLDER
<br>
</div>
</div>
Thanks in advance for any help. 在此先感谢您的帮助。
4 个解决方案
解决方案1
2 已采纳 2017-12-21 21:03:34
You just need to trim the spaces off and it works fine. 您只需要修剪空间就可以了。
var interval = 500; var timer = window.setInterval(function() { var text = $.trim($('.text-split-original').text()); var checkText = $.trim('4) PLACEHOLDER ') if(text == checkText){ alert("It has this text"); //do something }; }, interval);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <div class="sar__label"> <div class="text-split-original"> 4) PLACEHOLDER <br> </div> </div>
解决方案2
1 2017-12-21 21:05:08
Adding .trim() will remove the whitespace that is causing the comparison to fail: 添加.trim()将删除导致比较失败的空白：
var text = $('.text-split-original').text().trim();
Additionally, the checkText string '4) PLACEHOLDER ' contains an extra space at the end, which will also break the comparison. 另外， checkText字符串'4) PLACEHOLDER '在末尾包含一个额外的空格，这也会破坏比较。
Beyond that, running an interval is not the most efficient way to do things. 除此之外，运行间隔不是执行事情的最有效方法。 Perhaps you may want to look at when the contents of the div change instead. 也许您可能想看看div的内容何时更改 。 edit : This is deprecated as pointed out by @Barmar, see MutationObserver instead. 编辑 ：不推荐使用，如@Barmar所指出，请参阅MutationObserver 。
See your fixed code here (I've commented out the interval to prevent spamming yourself): https://codepen.io/anon/pen/JMRbMx 在此处查看您的固定代码（我已注释掉间隔以防止自己发垃圾邮件）： https : //codepen.io/anon/pen/JMRbMx
解决方案3
1 2017-12-21 21:07:43
Without JQuery: 没有JQuery：
<html>
<script>
var interval = 500;
var timer = window.setInterval(function() {
var text = document.getElementById('myId').innerHTML;
var checkText = 't'
console.log(text);
console.log(checkText);
if(text == checkText){
alert("It has this text");
//do something
};
}, interval);
</script>
<div class="sar__label">
<div id="myId" class="text-split-original">t</div>
</div>
</html>
I've intentionally erased all the spaces in the div. 我故意删除了div中的所有空格。 You need to trim() the spaces, or manipulate the text to match you case. 您需要trim（）空格，或操纵文本以匹配大小写。
解决方案4
0 2017-12-21 21:11:44
A great plugin to do just this is at https://j11y.io/javascript/monitoring-dom-properties/ -- and yeah, it does so by setInterval/clearInterval. 一个很好的插件可以在https://j11y.io/javascript/monitoring-dom-properties/上找到 -是的，它是通过setInterval / clearInterval实现的。 But the idea of a simple watch() plugin makes me happy. 但是一个简单的watch（）插件的想法让我很高兴。
Granted, its older (ca. 2009), but it still works. 当然，它的版本较旧（大约2009年），但仍然有效。
/********** * jQuery plugin to allow monitoring of any * DOM el's properties. It does so by * a setInterval/clearInterval hook. Taken from * https://j11y.io/javascript/monitoring-dom-properties/ **********/ jQuery.fn.watch = function(id, fn) { return this.each(function() { var self = this; var oldVal = self[id]; $(self).data( 'watch_timer', setInterval(function() { if (self[id] !== oldVal) { fn.call(self, id, oldVal, self[id]); oldVal = self[id]; } }, 100) ); }); return self; }; jQuery.fn.unwatch = function(id) { return this.each(function() { clearInterval($(this).data('watch_timer')); }); }; /***** * This is the part that does stuff. * The updater updates that content div * and the contentEl.watch leverages the * above extensible plugin. It's watching * the vanilla 'innerText' attribute of * that DOM el. *****/ var contentEl = $(".content"); $(".updater").on("keyup", function() { contentEl.text($(this).val()) }) contentEl.watch("innerText", function(propName, oldVal, newVal){ console.log('Text has been changed from '+oldVal+' to ' + newVal); })
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="content"> </div> <input type="text" class="updater" />
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.