如何去除引号或从这个(JavaScript)中获取元素

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

how to remove the quotes or get element from this (javascript)

问题

以下是您要的翻译部分:

"As topic, how can I remove the quote in the picuture below or get the img element from this?
(https://i.stack.imgur.com/kdPAP.png)

I m new to javascript and start making an image slider that can pop up a window while clicked to the image.

I cloned the li object which is clicked, and try to open it in the new window, it do work but how can I get the img only without the li?

Right now i m trying to call the cloned this object with innerHTML, but it shows the img element with quote, is there any way to remove the quote?
the quote that i want to remove

first time ask a question in here, if i violate any rules in the post, i delete the post, sorry for causing any inconvenience."

"这是您的代码的一部分:"

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <style>
  5. .risuto1 {
  6. max-width: 480px;
  7. max-height: 270px;
  8. margin: auto;
  9. position: relative;
  10. }
  11. ul {
  12. list-style-type: none;
  13. margin: auto;
  14. padding: 0;
  15. }
  16. .aitemu>img {
  17. max-width: 100%;
  18. }
  19. .aitemu {
  20. display: none;
  21. position: relative;
  22. }
  23. .aitemu.akutibu {
  24. display: block;
  25. }
  26. .risuto1>.mae,
  27. .tsugi {
  28. width: auto;
  29. height: auto;
  30. padding: 20px;
  31. top: 102.6px;
  32. position: absolute;
  33. cursor: pointer;
  34. background-color: red;
  35. }
  36. .risuto1>.tsugi {
  37. left: 431.8px;
  38. }
  39. </style>
  40. </head>
  41. <body>
  42. <script>
  43. var risuto1 = document.createElement("div");
  44. risuto1.classList.add("risuto1");
  45. document.body.appendChild(risuto1);
  46. var suraidaaitemu = document.createElement("ul");
  47. suraidaaitemu.classList.add("suraidaaitemu");
  48. risuto1.appendChild(suraidaaitemu);
  49. var imejisosurisuto = ["https://pbs.twimg.com/media/CGGc3wKVEAAjmWj?format=jpg&name=medium", "https://pbs.twimg.com/media/EYCXvuzU8AEepqD?format=jpg&name=large", "https://s3-ap-northeast-1.amazonaws.com/cdn.bibi-star.jp/production/imgs/images/000/668/074/original.jpg?1626914998", "https://livedoor.blogimg.jp/rin20064/imgs/7/3/73251146.jpg", "https://www.tbs.co.jp/anime/oregairu/character/img/chara_img_02.jpg"]
  50. //var imejirisuto=[]
  51. for (var n = 0; n < imejisosurisuto.length; n++) {
  52. var imeji = document.createElement("img");
  53. imeji.src = imejisosurisuto[n];
  54. var aitemu = document.createElement("li");
  55. aitemu.classList.add("aitemu");
  56. suraidaaitemu.appendChild(aitemu);
  57. aitemu.appendChild(imeji);
  58. aitemu.onclick=atarashivindou;
  59. }
  60. var akutibunasaishonoko = document.querySelector(".suraidaaitemu").firstChild;
  61. akutibunasaishonoko.classList.add("akutibu");
  62. var mae = document.createElement("div");
  63. mae.classList.add("mae");
  64. mae.innerHTML = "&#10094";
  65. risuto1.appendChild(mae);
  66. var tsugi = document.createElement("div");
  67. tsugi.classList.add("tsugi");
  68. tsugi.innerHTML = "&#10095";
  69. risuto1.appendChild(tsugi);
  70. var tensuu = 0;
  71. var suraido = document.querySelector(".suraidaaitemu").children;
  72. var gokeisuraido = suraido.length;
  73. tsugi.onclick = function () {
  74. Tsugi("Tsugi");
  75. }
  76. mae.onclick = function () {
  77. Tsugi("Mae");
  78. }
  79. function Tsugi(houkou) {
  80. if (houkou == "Tsugi") {
  81. tensuu++;
  82. if (tensuu == gokeisuraido) {
  83. tensuu = 0;
  84. }
  85. }
  86. else {
  87. if (tensuu == 0) {
  88. tensuu = gokeisuraido - 1;
  89. }
  90. else {
  91. tensuu--;
  92. }
  93. for (var i = 0; i < suraido.length; i++) {
  94. suraido[i].classList.remove("akutibu");
  95. }
  96. suraido[tensuu].classList.add("akutibu");
  97. }
  98. function atarashivindou(){
  99. var Atarashivindou = window.open("", "_blank", "width: 1000px, max-height: 562.5px");
  100. var kakudaigazou=document.createElement("div");
  101. kakudaigazou.classList.add("kakudaigazou");
  102. Atarashivindou.document.body.appendChild(kakudaigazou);
  103. var koronaitemu=this.cloneNode(true);
  104. var koronimeji=koronaitemu.innerHTML;
  105. kakudaigazou.append(koronimeji);
  106. }
  107. </script>
  108. </body>
英文:

As topic, how can I remove the quote in the picuture below or get the img element from this?
(https://i.stack.imgur.com/kdPAP.png)

I m new to javascript and start making an image slider that can pop up a window while clicked to the image.

I cloned the li object which is clicked, and try to open it in the new window, it do work but how can I get the img only without the li?

Right now i m trying to call the cloned this object with innerHTML, but it shows the img element with quote, is there any way to remove the quote?
the quote that i want to remove

first time ask a question in here, if i violate any rules in the post, i delete the post, sorry for causing any inconvenience.

Here is the code

  1. &lt;!DOCTYPE html&gt;
  2. &lt;html&gt;
  3. &lt;head&gt;
  4. &lt;style&gt;
  5. .risuto1 {
  6. max-width: 480px;
  7. max-height: 270px;
  8. margin: auto;
  9. position: relative;
  10. }
  11. ul {
  12. list-style-type: none;
  13. margin: auto;
  14. padding: 0;
  15. }
  16. .aitemu&gt;img {
  17. max-width: 100%;
  18. }
  19. .aitemu {
  20. display: none;
  21. position: relative;
  22. }
  23. .aitemu.akutibu {
  24. display: block;
  25. }
  26. .risuto1&gt;.mae,
  27. .tsugi {
  28. width: auto;
  29. height: auto;
  30. padding: 20px;
  31. top: 102.6px;
  32. position: absolute;
  33. cursor: pointer;
  34. background-color: red;
  35. }
  36. .risuto1&gt;.tsugi {
  37. left: 431.8px;
  38. }
  39. &lt;/style&gt;
  40. &lt;/head&gt;
  41. &lt;body&gt;
  42. &lt;script&gt;
  43. var risuto1 = document.createElement(&quot;div&quot;);
  44. risuto1.classList.add(&quot;risuto1&quot;);
  45. document.body.appendChild(risuto1);
  46. var suraidaaitemu = document.createElement(&quot;ul&quot;);
  47. suraidaaitemu.classList.add(&quot;suraidaaitemu&quot;);
  48. risuto1.appendChild(suraidaaitemu);
  49. var imejisosurisuto = [&quot;https://pbs.twimg.com/media/CGGc3wKVEAAjmWj?format=jpg&amp;name=medium&quot;, &quot;https://pbs.twimg.com/media/EYCXvuzU8AEepqD?format=jpg&amp;name=large&quot;, &quot;https://s3-ap-northeast-1.amazonaws.com/cdn.bibi-star.jp/production/imgs/images/000/668/074/original.jpg?1626914998&quot;, &quot;https://livedoor.blogimg.jp/rin20064/imgs/7/3/73251146.jpg&quot;, &quot;https://www.tbs.co.jp/anime/oregairu/character/img/chara_img_02.jpg&quot;]
  50. //var imejirisuto=[]
  51. for (var n = 0; n &lt; imejisosurisuto.length; n++) {
  52. var imeji = document.createElement(&quot;img&quot;);
  53. imeji.src = imejisosurisuto[n];
  54. var aitemu = document.createElement(&quot;li&quot;);
  55. aitemu.classList.add(&quot;aitemu&quot;);
  56. suraidaaitemu.appendChild(aitemu);
  57. aitemu.appendChild(imeji);
  58. aitemu.onclick=atarashivindou;
  59. }
  60. var akutibunasaishonoko = document.querySelector(&quot;.suraidaaitemu&quot;).firstChild;
  61. akutibunasaishonoko.classList.add(&quot;akutibu&quot;);
  62. var mae = document.createElement(&quot;div&quot;);
  63. mae.classList.add(&quot;mae&quot;);
  64. mae.innerHTML = &quot;&amp;#10094&quot;;
  65. risuto1.appendChild(mae);
  66. var tsugi = document.createElement(&quot;div&quot;);
  67. tsugi.classList.add(&quot;tsugi&quot;);
  68. tsugi.innerHTML = &quot;&amp;#10095&quot;;
  69. risuto1.appendChild(tsugi);
  70. var tensuu = 0;
  71. var suraido = document.querySelector(&quot;.suraidaaitemu&quot;).children;
  72. var gokeisuraido = suraido.length;
  73. tsugi.onclick = function () {
  74. Tsugi(&quot;Tsugi&quot;);
  75. }
  76. mae.onclick = function () {
  77. Tsugi(&quot;Mae&quot;);
  78. }
  79. function Tsugi(houkou) {
  80. if (houkou == &quot;Tsugi&quot;) {
  81. tensuu++;
  82. if (tensuu == gokeisuraido) {
  83. tensuu = 0;
  84. }
  85. }
  86. else {
  87. if (tensuu == 0) {
  88. tensuu = gokeisuraido - 1;
  89. }
  90. else {
  91. tensuu--;
  92. }
  93. }
  94. for (var i = 0; i &lt; suraido.length; i++) {
  95. suraido[i].classList.remove(&quot;akutibu&quot;);
  96. }
  97. suraido[tensuu].classList.add(&quot;akutibu&quot;);
  98. }
  99. function atarashivindou(){
  100. var Atarashivindou = window.open(&quot;&quot;, &quot;_blank&quot;, &quot;width: 1000px, max-height: 562.5px&quot;);
  101. var kakudaigazou=document.createElement(&quot;div&quot;);
  102. kakudaigazou.classList.add(&quot;kakudaigazou&quot;);
  103. Atarashivindou.document.body.appendChild(kakudaigazou);
  104. var koronaitemu=this.cloneNode(true);
  105. var koronimeji=koronaitemu.innerHTML;
  106. kakudaigazou.append(koronimeji);
  107. }
  108. &lt;/script&gt;
  109. &lt;/body&gt;

答案1

得分: 0

.innerHTML是一个字符串。你不想追加字符串,而是要追加元素。所以将这部分代码修改为:

  1. var koronimeji = this.querySelector("img").cloneNode();
  2. kakudaigazou.append(koronimeji);
英文:

.innerHTML is a string. You don't want to append a string, but the element. So change this:

  1. var koronaitemu=this.cloneNode(true);
  2. var koronimeji=koronaitemu.innerHTML;
  3. kakudaigazou.append(koronimeji);

...to this:

  1. var koronimeji=this.querySelector(&quot;img&quot;).cloneNode();
  2. kakudaigazou.append(koronimeji);

huangapple
  • 本文由 发表于 2023年2月18日 07:30:03
  • 转载请务必保留本文链接:https://go.coder-hub.com/75490123.html
匿名

发表评论

匿名网友

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

确定