javascript 检查元素内是否有一些文本
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/28327989/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Check if there's some text inside an element
提问by Alexandr Belov
I am creating an If...Else statement and need to check if the element has innerHTML / textContent. Like this:
我正在创建一个 If...Else 语句,需要检查该元素是否具有 innerHTML/textContent。像这样:
if (<span class="event"> *yet has some text inside*) {do smth}
else {do smth else};
So, how do I do that using Javascript? Please, help!
那么,我如何使用 Javascript 做到这一点?请帮忙!
UPD!I have dynamically changing content, and
更新!我有动态变化的内容,并且
element.innerHTML
seems not working after I put some text inside my < span >. I mean it still thinks the < span > is empty. Any cure for that?
在我的 <span> 中放入一些文本后,似乎不起作用。我的意思是它仍然认为 <span> 是空的。有什么治疗方法吗?
回答by Md. Ashaduzzaman
Check the innerHTML
of the span using document.getElementsByClassName("ClassName");
. You need to index
it as you may have more than one element with same class name. Add text inside span
dynamically on button click. And check again if it effects the output. Try this way,
使用 来检查innerHTML
跨度的document.getElementsByClassName("ClassName");
。您需要index
它,因为您可能有多个具有相同类名的元素。span
单击按钮时在内部动态添加文本。并再次检查它是否影响输出。试试这个方法
HTML :
HTML :
<span class="event"></span>
<button id="addTextButton">Add Text In Span</button>
<button id="removeSpanTextButton">Empty Span</button>
<button id="checkSpanButton">Check Span Content</button>
javaScript :
脚本:
var spanContent = document.getElementsByClassName("event")[0];
checkSpanButton.onclick = function(){
if(spanContent.innerHTML == ""){
alert("Span is empty..");
}
else{
alert("Span Text : " + spanContent.innerHTML);
}
};
// dynamically add text
addTextButton.onclick = function(){
spanContent.innerHTML = "Added This Text.";
};
removeSpanTextButton.onclick = function(){
spanContent.innerHTML = "";
};
回答by Bhojendra Rauniyar
You can use:
您可以使用:
var element = document.getElementsByClassName('event')[0];
if(element.innerHTML){
//do something
} else{
// do other things
}
If you want to iterate over all element that has class event then use:
如果要遍历所有具有类事件的元素,请使用:
var element = document.getElementsByClassName('event');
for(var i=0;i<element.length;i++){
if(element[i].innerHTML){
//do something
} else{
// do other things
}
}
回答by Acidic
It's pretty simple:
这很简单:
if (element.innerHTML) {
// element has content
} else {
// element is empty
}
回答by UndeadDragon
for example:
例如:
var x = document.getElementsByClassName("event");
var i;
for (i = 0; i < x.length; i++) {
if (x[i].innerHTML)...
}
You can access HTML elements from JS with many ways. Once you have accessed yours element, you can just if(elem.innerHTML).
您可以通过多种方式从 JS 访问 HTML 元素。一旦您访问了您的元素,您就可以使用 if(elem.innerHTML)。
P.S. var element = document.getElementsByClassName('event')[0];
PS var element = document.getElementsByClassName('event')[0];
Don't use that advice below without checking array size.
不要在不检查数组大小的情况下使用下面的建议。
回答by Ajay Singh
Alternate method to innerHTML
innerHTML 的替代方法
if(document.getElementById("element_id").lastChild) {
//Has content
}
else {
//No content
}