Pickles Exercise – 使用DOM更改文本

huangapple
go评论91阅读模式
英文:

Pickles Exercise - change the text by using DOM

问题

  1. // YOUR CODE GOES IN HERE:
  2. const spanElement = document.querySelector('span');
  3. spanElement.textContent = 'Disgusting';

请尝试使用上述JavaScript代码来更改<span>元素中的文本。

英文: 
  1. &lt;!DOCTYPE html&gt;
  3. &lt;head&gt;
  4.     &lt;title&gt;Pickles&lt;/title&gt;
  5.     &lt;!--LEAVE THESE LINES ALONE, PLEASE! THEY MAKE THE LIVE PREVIEW WORK!--&gt;
  6.     &lt;script src=&quot;node_modules/babel-polyfill/dist/polyfill.js&quot; type=&quot;text/javascript&quot;&gt; &lt;/script&gt;
  7.     &lt;script src=&quot;https://unpkg.com/@babel/standalone/babel.min.js&quot;&gt;&lt;/script&gt;
  9. &lt;/head&gt;
  11. &lt;body&gt;
  12.     &lt;!--PLEASE LEAVE THIS LINE ALONE! MAKE YOUR CHANGES USING JAVASCRIPT!!--&gt;
  13.     &lt;h1&gt;Pickles Are &lt;span&gt;Delicious&lt;/span&gt;&lt;/h1&gt;
  14. &lt;/body&gt;
  16. &lt;/html&gt;

Select the <span> element that currently reads "Delicious".

Change its text to read "Disgusting" USING JAVASCRIPT.

  1. // YOUR CODE GOES IN HERE:
  2. const pickleTaste = document.getElementsByTagName(&#39;span&#39;).textContent = &#39;Disgusting&#39;;
  3. console.log(pickleTaste);

I tried with innerText, textContent and innerHTML, However solution doesn't pass.

答案1

得分: 1

以下是代码的翻译部分：

  1. // document.getElementsByTagName() 返回一个数组，而不是一个单一的节点
  2. var PickleTaste = document.getElementsByTagName("span");
  3. PickleTaste[0].textContent = "恶心";
  4. console.log(PickleTaste);
  1. <!DOCTYPE html>
  2. <html>
  3.   <head>
  4.       <title>泡菜</title>
  5.       <!-- 请不要改动以下这些行，它们让实时预览工作正常！ -->
  6.       <script src="node_modules/babel-polyfill/dist/polyfill.js" type="text/javascript"> </script>
  7.       <script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
  8.   </head>
  9.   <body>
  10.       <!-- 请不要改动以下这行，使用JavaScript进行更改！ -->
  11.       <h1>泡菜是 <span>美味的</span></h1>
  12.   </body>
  13. </html>
英文:

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-js -->

  1. // document.getElementsByTagName() returns an array, not a singular node
  2. var PickleTaste = document.getElementsByTagName(&quot;span&quot;);
  3. PickleTaste[0].textContent = &quot;Disgusting&quot;;
  4. console.log(PickleTaste);

<!-- language: lang-html -->

  1. &lt;!DOCTYPE html&gt;
  2. &lt;html&gt;
  3.   &lt;head&gt;
  4.       &lt;title&gt;Pickles&lt;/title&gt;
  5.       &lt;!--LEAVE THESE LINES ALONE, PLEASE! THEY MAKE THE LIVE PREVIEW WORK!--&gt;
  6.       &lt;script src=&quot;node_modules/babel-polyfill/dist/polyfill.js&quot; type=&quot;text/javascript&quot;&gt; &lt;/script&gt;
  7.       &lt;script src=&quot;https://unpkg.com/@babel/standalone/babel.min.js&quot;&gt;&lt;/script&gt;
  8.   &lt;/head&gt;
  9.   &lt;body&gt;
  10.       &lt;!--PLEASE LEAVE THIS LINE ALONE! MAKE YOUR CHANGES USING JAVASCRIPT!!--&gt;
  11.       &lt;h1&gt;Pickles Are &lt;span&gt;Delicious&lt;/span&gt;&lt;/h1&gt;
  12.   &lt;/body&gt;
  13. &lt;/html&gt;

<!-- end snippet -->

Can't do much to prove I didn't copy Anil kumar

huangapple
  • 本文由 发表于 2023年2月27日 14:32:59
  • 转载请务必保留本文链接：https://go.coder-hub.com/75577368.html
  • dom
  • html
  • javascript
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定