使用 JavaScript 更改标签文本

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/4488714/
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

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 12:37:02  来源:igfitidea点击:

Change label text using JavaScript

javascripthtmllabelinnerhtml

提问by phil crowe

Why doesn't the following work for me?

为什么以下对我不起作用?

<script>
    document.getElementById('lbltipAddedComment').innerHTML = 'Your tip has been submitted!';
</script>
<label id="lbltipAddedComment"></label>

回答by Konerak

Because your script runs BEFORE the label exists on the page (in the DOM). Either put the script after the label, or wait until the document has fully loaded (use an OnLoad function, such as the jQuery ready()or http://www.webreference.com/programming/javascript/onloads/)

因为您的脚本在标签存在于页面上(在 DOM 中)之前运行。要么将脚本放在标签之后,要么等到文档完全加载(使用 OnLoad 函数,例如jQuery ready()http://www.webreference.com/programming/javascript/onloads/

This won't work:

这行不通:

<script>
  document.getElementById('lbltipAddedComment').innerHTML = 'your tip has been submitted!';
</script>
<label id="lbltipAddedComment">test</label>

This will work:

这将起作用:

<label id="lbltipAddedComment">test</label>
<script>
  document.getElementById('lbltipAddedComment').innerHTML = 'your tip has been submitted!';
</script>

This example (jsfiddle link)maintains the order (script first, then label) and uses an onLoad:

此示例(jsfiddle 链接)维护顺序(先脚本,然后标签)并使用 onLoad:

<label id="lbltipAddedComment">test</label>
<script>
function addLoadEvent(func) {  
      var oldonload = window.onload;  
      if (typeof window.onload != 'function') {  
        window.onload = func;  
      } else {  
        window.onload = function() {  
          if (oldonload) {  
            oldonload();  
          }  
          func();  
        }  
      }  
    }  

   addLoadEvent(function() {  
document.getElementById('lbltipAddedComment').innerHTML = 'your tip has been submitted!';

    });  
</script>

回答by GordonM

Have you tried .innerTextor .valueinstead of .innerHTML?

你试过.innerText还是.value代替.innerHTML

回答by mvladic

Because a label element is not loaded when a script is executed. Swap the label and script elements, and it will work:

因为执行脚本时未加载标签元素。交换 label 和 script 元素,它将起作用:

<label id="lbltipAddedComment"></label>
<script>
    document.getElementById('lbltipAddedComment').innerHTML = 'Your tip has been submitted!';
</script>

回答by Pochi

Use .textContentinstead.

使用.textContent来代替。

I was struggling with changing the value of a label as well, until I tried this.

我也在努力改变标签的值,直到我尝试了这个。

If this doesn't solve try inspecting the object to see what properties you can set by logging it to the console with console.diras shown on this question: How can I log an HTML element as a JavaScript object?

如果这不能解决,请尝试检查对象以查看可以通过将其记录到控制台来设置哪些属性,console.dir如以下问题所示:如何将 HTML 元素记录为 JavaScript 对象?

回答by Shilpa

Using .innerTextshould work.

使用.innerText应该有效。

document.getElementById('lbltipAddedComment').innerText = 'your tip has been submitted!';

回答by mustapha mekhatria

Here is another way to change the text of a label using jQuery:

这是使用 jQuery 更改标签文本的另一种方法:

<script>
  $("#lbltipAddedComment").text("your tip has been submitted!");
</script>

Check the JsFiddle example

检查JsFiddle 示例

回答by user1611219

Try this:

尝试这个:

<label id="lbltipAddedComment"></label>
<script type="text/javascript"> 
      document.getElementById('<%= lbltipAddedComment.ClientID %>').innerHTML = 'your tip has been submitted!';
</script>

回答by Rachana

Because the script will get executed first.. When the script will get executed, at that time controls are not getting loaded. So after loading controls you write a script.

因为脚本将首先执行。当脚本将被执行时,那时控件不会被加载。因此,在加载控件后,您编写了一个脚本。

It will work.

它会起作用。