programing

JS를 이용하여 h1 태그의 값을 얻는 방법은?

iphone6s 2023. 10. 4. 21:03
반응형

JS를 이용하여 h1 태그의 값을 얻는 방법은?

저는 3페이지가 있고, 2페이지는 워드프레스 페이지이고 나머지 1페이지는 양식이 있는 커스텀 페이지 템플릿입니다.wp-job manager 플러그인을 사용하여 2페이지가 생성됩니다.첫 번째 페이지에는 드롭다운 메뉴가 있고 작업 목록이 포함되어 있습니다.두 번째 페이지에 직업에 대한 설명이 있습니다.

이제 사용자가 입력 버튼을 클릭하여 3페이지에 전달하고 JS를 이용하여 입력 텍스트 박스(Position input text box) 중 하나에 표시한 후 2페이지에 h1 tag의 값을 받고 싶습니다.

이거 어떻게 해요?

두번째 페이지 링크입니다.
3페이지

HTML:

<header class="entry-header">
    <h1 class="entry-title">Collections Trainer</h1>
</header>

바닐라 자바스크립트 솔루션(프레임워크 필요 없음):

var h1Text = document.querySelector(".entry-title").textContent;

jquery를 사용할 수 있습니까? 그렇다면 jquery에서 버튼을 클릭한 후 쿼리 문자열을 사용하여 다른 페이지로 전송하면 h1 값을 얻을 수 있습니다.

편집됨

페이지의 jquery 파일을 사용자 jquery 기능에 추가합니다.그리고 $(문서) 안에 함수를 넣어야 합니다.개체에 함수를 연결하기 위해 ready () 함수를 선택합니다.

jquery에 대해서는 https://learn.jquery.com/ 에서 더 많이 배울 수 있습니다.

<script src="https://code.jquery.com/jquery-2.2.0.min.js"/>
<script>
  $(document).ready(function(){
   $('.application_button').click(function(){
        var headervalue = $(".entry-title").text();
        window.location = "http://homecredit.ph/testEnvironment/4537-2/?position="+headervalue;
    });
});
</script>

normal js에서 표제를 부여한 클래스는 다음을 사용합니다.

var x = document.getElementsByClassName('entry-title').value;
console.log(x); //outputs collections trainer

jQuery를 사용하는 경우에는

$('.entry-title').text

도움이 되길 바랍니다.

버튼 클릭 후에만 h1 값을 얻으려면 버튼의 on클릭을 해야 합니다.

$.(document).ready(function(){
var header1Text ='';
 $('.application_button').onclick(function(){
   header1Text = $('h1').html();
  });
//To display it in whichever textbox you want:
$('#GivesomeIDtoYourTextBox').val(header1Text);
});

추신: 페이지에 jquery source도 포함시켜야 합니다.

jQuery: H1 값을 얻으려면

 var gValue=jQuery("header h1.entry-title").text();
    alert(gValue);

다른 페이지에서 값을 가져와야 할 경우 QueryString을 통해 또는 HTML5 LocalStorage Sample Code를 사용하여 값을 보낼 수 있습니다.

var first_page_h1_Value=jQuery("header h1.entry-title").text();
var second_page_h1_Value=jQuery("header h1.entry-title").text();

localStorage.setItem("FirstPage", first_page_h1_Value);
localStorage.setItem("SecondPage", second_page_h1_Value);

세 번째 페이지에서는 두 페이지 모두 머리글 텍스트를 얻을 수 있습니다.

 alert(localStorage.FirstPage);
 alert(localStorage.SecondPage);

Jquery를 사용하는 경우 H1 태그의 ID를 "h1Title"로 가정하고 H1 태그에 ID를 부여하는 것을 권장합니다.HTML:

<h1 id="h1Title">Heading here</h1>

그런 다음 JQuery에서 다음과 같이 쓰는 제목을 얻으려면 다음과 같이 하십시오.

var title = $("#h1Title").text();
//To Check Whether you are getting text or not
console.log("title :"+title);

이렇게 하면 제목 텍스트를 얻을 수 있습니다.

언급URL : https://stackoverflow.com/questions/35032997/how-to-get-the-value-of-h1-tag-using-js

반응형