이미 생성 된 스크립트 태그를 제거하고 다시 생성하는 방법은 무엇입니까?

Question

나는 심각한 문제에 직면 해있다. 두 부분으로 된 페이지가 있습니다. 페이지의 첫 번째 부분에서 html은 ajax 요청을 통해 렌더링됩니다. 두 번째 페이지에서는 html이 페이지로드시 렌더링됩니다. 페이지의 주먹 부분은 다른 페이지 매김 스크립트를 가지고 따로 처리됩니다. 페이지 매김은 동일한 URL에 아약스 요청을 보내어 처리됩니다.

1 부에 문제가 있습니다. 1 부에 대한 HTML을 생성하는 스크립트는 javascript 태그를 많이 생성하고 javascript를 사용하여 HTML을 생성합니다. 이제 어떻게 그 HTML에서 새 스크립트 태그를 삽입 할 때 내가 뭐하는 거지은 다음과 같이이다 :

var script = document.createElement("script"); 
script.type = "text/javascript"; 
script.text = "window.twttr = (function (d,s,id) {var t, js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) return; js=d.createElement(s); js.id=id;js.src=\"//platform.twitter.com/widgets.js\"; fjs.parentNode.insertBefore(js, fjs);return window.twttr || (t = { _e: [], ready: function(f){ t._e.push(f) } });}(document, \"script\", \"twitter-wjs\"));(function(d, s, id) {var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return;js = d.createElement(s); js.id = id; js.src = \"//connect.facebook.net/en_GB/all.js#xfbml=1\"; fjs.parentNode.insertBefore(js, fjs);}(document, \"script\", \"facebook-jssdk\"));var script_generated=1";    // use this for inline script 
document.body.appendChild(script); 

그것은 트위터와 페이스 북 버튼과 같은 페이스 북과 제의 각 항목에 트위터 버튼을 보여주기 위해 문을 연결하는 사실입니다 페이지의 일부. 페이지가 처음으로로드되면 스크립트 태그가 성공적으로 생성됩니다. 그러나 페이지 매김을 클릭하면 새 페이지에 대해 html을 갖는 새로운 Ajax 요청을 보내고 동일한 스크립트 태그를 다시 생성합니다. 따라서 두 번째 페이지에서 내 Twitter 버튼과 Facebook 같은 버튼이 표시되지 않습니다.

페이스 북과 트위터의 진술을 이중으로 연결했기 때문입니다. 그런 다음 스크립트 태그를 생성하는 동안 변수를 생성하고 값을 설정합니다. 그리고 각 요청에 대해 변수가 존재하는지 여부를 확인합니다. 그것이 내가 이런 특정 스크립트 태그 생성하지 않습니다 존재하는 경우 : 버튼과 같은

if(typeof script_generated === "undefined") { 
    var script = document.createElement("script"); 
    script.type = "text/javascript"; 
    script.text = "window.twttr = (function (d,s,id) {var t, js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) return; js=d.createElement(s); js.id=id;js.src=\"//platform.twitter.com/widgets.js\"; fjs.parentNode.insertBefore(js, fjs);return window.twttr || (t = { _e: [], ready: function(f){ t._e.push(f) } });}(document, \"script\", \"twitter-wjs\"));(function(d, s, id) {var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return;js = d.createElement(s); js.id = id; js.src = \"//connect.facebook.net/en_GB/all.js#xfbml=1\"; fjs.parentNode.insertBefore(js, fjs);}(document, \"script\", \"facebook-jssdk\"));var script_generated=1"; 
      // use this for inline script 
    document.body.appendChild(script); 
} 

재생되지 않습니다 스크립트 태그를 수행하지만, 트윗과 페이스 북을 여전히 표시되지 않습니다.

이제 스크립트 태그가 아약스 요청에 의해 생성되므로 버튼이 스크립트 태그를 찾지 못해 제대로 표시되지 않는다는 것을 해석했습니다.

이제 내가 원하는 것은 요청이 해당 파일로 전송 될 때마다 해당 스크립트 태그가 있는지 여부를 먼저 확인하고, 존재하는 경우 삭제하고 새 태그를 생성하고 그렇지 않으면 생성합니다. 어떻게하는지 안내해주세요.

문제를 잘못 해석 한 경우 정확한 문제와 해결 방법을 알려주십시오.

Answer 1

동적으로 추가 할 때 스크립트 태그에 ID를 부여 할 수 있습니다.

var script = document.createElement("script"); 
script.setAttribute('id', 'addedScript'); 
script.type = "text/javascript"; 
script.text = "window.twttr = (function (d,s,id) {var t, js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) return; js=d.createElement(s); js.id=id;js.src=\"//platform.twitter.com/widgets.js\"; fjs.parentNode.insertBefore(js, fjs);return window.twttr || (t = { _e: [], ready: function(f){ t._e.push(f) } });}(document, \"script\", \"twitter-wjs\"));(function(d, s, id) {var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return;js = d.createElement(s); js.id = id; js.src = \"//connect.facebook.net/en_GB/all.js#xfbml=1\"; fjs.parentNode.insertBefore(js, fjs);}(document, \"script\", \"facebook-jssdk\"));var script_generated=1"; 
// use this for inline script 
document.body.appendChild(script); 

그런 다음 이것을 사용하여 스크립트 태그가 있는지 확인하고 .remove() 쿼리 함수를 사용하여 제거 할 수 있습니다.

if(addedScript != undefined) { 
    $("#addedScript").remove(); 
} 

Answer 2

안녕하세요 당신은 해당 스크립트 태그에 대한 참조 개체를 얻을 수 있으며 개체를 사용하여 참조 된 src 파일을 변경할 수 있습니다.

그것은 다음과 같이해야한다,

var $jsRef = $('<script type="text/javascript" >').appendTo(document.body); 
$jsRef.attr("src","jsFileName.js"); 

// You can also add content like this 
$jsRef.append(content); 


// You can change the js file name or content the same way 
$jsRef.attr("src","newJSFileName.js"); 

// Changing the content like this 
$jsRef.empty(); 
$jsRef.append(content); 

는 다른 방법으로 대신 개체에 액세스 할 수있는 ID를 기반으로 컨텐츠를 스크립트 태그의 ID를 설정하고 변경할 수 있습니다.