문제를 잘 정의하는 것은 문제를 절반 해결한 것이다. - 2023.12

이 문서는 읽기 전용입니다. 원본을 볼 수는 있지만 바꿀 수는 없습니다. 문제가 있다고 생각하면 관리자에게 문의하세요.

======JavaScript / jQuery HTML DOM======
<WRAP left notice 80%>
  * description : JavaScript / jQuery HTML DOM
  * author      : 오션
  * email       : shlim@repia.com
  * lastupdate  : 2021-04-14
</WRAP>
<WRAP clear></WRAP>
\\
====Ref====
[[https://www.w3schools.com/js/js_jquery_dom.asp|JavaScript / jQuery HTML DOM]]
\\

=====Removing HTML Elements=====
%%HTML%% 요소를 제거합니다:\\

====JQuery====
<code jquery>
<!DOCTYPE html>
<html lang="en">
<head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
</head>
<body>

  <h2>Remove an HTML Element with JQuery</h2>

  <h2 id="id01">Hello World!</h2>
  <h2 id="id02">Hello Sweden!!</h2>

  <script>
    $(document).ready(function () {
      $('#id02').remove();
    });
  </script>

</body>
</html>
</code>

====JavaScript====
<code javascript>
<!DOCTYPE html>
<html lang="en">
<body>

  <h2>Remove an HTML Element with JavaScript</h2>

  <h2 id="id01">Hello World!</h2>
  <h2 id="id02">Hello Sweden!!</h2>

  <script>
    var element = document.getElementById("id01");
    element.parentNode.removeChild(element);
  </script>

</body>
</html>
</code>

=====Get Parent Element=====
%%HTML%% 요소의 부모를 반환합니다:\\

====JQuery====
<code jquery>
<!DOCTYPE html>
<html lang="en">
<head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
</head>
<body>

  <h1>Getting Parent HTML Element with JQuery</h1>

  <h2 id="01">Hello World!</h2>
  <h2 id="02">Hello Sweden!!</h2>
  <h2 id="03">Hello Austria!!!</h2>

  <p id="demo"></p>

  <script>
    $(document).ready(function () {
      var myParent = $("#02").parent();
      $("#demo").text(myParent.prop("nodeName"));
    });
  </script>

</body>
</html>
</code>

====JavaScript====
<code javascript>
<!DOCTYPE html>
<html lang="en">
<body>

  <h1>Getting Parent HTML Element with JavaScript</h1>

  <h2 id="01">Hello World!</h2>
  <h2 id="02">Hello Sweden!!</h2>
  <h2 id="03">Hello Austria!!!</h2>

  <p id="demo"></p>

  <script>
    var myParent = document.getElementById("02").parentNode;
    document.getElementById("demo").innerHTML = myParent.nodeName;
  </script>

</body>
</html>
</code>



{{tag>오션 JavaScript jQuery HTML DOM}}

문제를 잘 정의하는 것은 문제를 절반 해결한 것이다. - 2023.12

사용자 도구

사이트 도구

문서 도구