Javascript string 파일 이름 내의 점 (.) 바꾸기

Question

javascript를 사용하여 일부 html (문자열)을 고치고 수정하려고합니다.이 html에는 img src 또는 css 배경과 같은 참조가 포함 된 파일 이름이 있습니다. 전체 중지/마침표/점 /.

내가 해봤

<img src="../images/filename.01.png"> <img src="../images/filename.02.png"> 
<div style="background:url(../images/file.name.with.more.dots.gif)"> 

, 고투 나를이 문자열을 구문 분석하고, 예를 들어 그 파일 이름에있는 점없이 다시 침을 할 수 있도록 깔끔한 정규식을 마련하는 데 실패

<img src="../images/filename01.png"/> <img src="../images/filename02.png"/> 
<div style="background:url(../images/filenamewithmoredots.gif)"> 

저는 이미지 파일 이름에만 영향을주고 싶습니다. 분명히 파일 형식 만 남기고 싶습니다.

정규식 같은 :

/(.*)(?=(.gif|.png|.jpg|.jpeg)) 

날 별도로 파일 이름과 확장자의 주요 부분을 일치시킬 수 있습니다,하지만 그것도 그냥 내가 원하는 하나의 파일 이름에서 문자열의 전체에 걸쳐 일치합니다.

들어오는 HTML에 대한 제어권이 없습니다. 그냥 사용하고 있습니다.

내가 넘치는 것을 도와주세요, 당신은 나의 유일한 희망입니다!

Answer 1

내가이 정규 표현식에 적합한 문제, 훨씬 덜 한 깔끔한 표현이 아니라는 것을 동의합니다.

그러나 나는 당신이 여기있는 것을 듣지 않았다고 믿습니다. 그래서, 경우에 당신은

var src, result = '<img src="../images/filename.01.png"> <img src="../images/filename.02.png"><div style="background:url(../images/file.name.with.more.dots.gif)">'; 
do { 
    src = result; 
    result = src.replace(/((?:url(\()|href=|src=)['"]?(?:[^'"\/]*\/)*[^'"\/]*)\.(?=[^\.'")]*\.(?:gif|png|jpe?g)['")>}\s])/g, '$1'); 
} while (result != src) 

는 기본적으로 이미지의 URL의 파일 이름의 두 번째 마지막 점을 제거하는 유지 아무도 없을 때까지 ... 문자열로 입력을 유지하려는. 표현식을 고쳐야 할 필요가있는 경우에 대한 설명입니다. 가볍게 트레드 :

• ( js regx가 lookbehind가 없기 때문에 메인 캡처 그룹을 시작하십시오.
  • (?:url(\()|href=|src=)['"]? URL 시작. url()을 적절히 인용하여 나중에 참조를 사용할 수있게하는 것이 더 안전 할 수 있지만 불행히도 주어진 예제는 그렇지 않습니다.
  • (?:[^'"\/]*\/)* URL의 폴더 부분.
  • [^'"\/]* 마지막 두 번째 점 앞에 오는 파일 이름의 일부입니다.
• ) 주 메인 그룹.
• \. 이것은 우리가 없애고 싶은 마지막 두 번째 점입니다.
• (?= 뒤를 살펴보십시오.
  • [^\.'")]* 마지막 두 번째 점과 마지막 점 사이에 오는 파일 이름의 일부입니다.
  • \.(?:gif|png|jpe?g) URL의 이미지 확장자가 끝나야합니다.
  • ['")>}\s] 인용구, ')', '>', '}'또는 공백 일 수있는 URL을 닫습니다. 가능한 경우 여기에서 사용자가 다시 참조해야합니다. (처음 대답했을 때는 ['"]?\b이었습니다)
• ) 끝이 보이지 않습니다.

Answer 2

귀하의 문제는 .*의 욕심이 일치합니다. 어쩌면 더 나은이

([^\/]*)(?=(.gif|.png|.jpg|.jpeg)) 

[^\/] 같은 것을 시도하는 모든 문자와 일치하지만 다른 점은

슬래시 문자 클래스, 당신은 말 그대로

([^\/]*)(?=\.(gif|png|jpg|jpeg)) 

Answer 3

그것을 일치하도록 .을 탈출해야합니다 문제는 .은 "임의의 문자"를 의미합니다.

탈출을 :

/(.*)(?=(\.gif|\.png|\.jpg|\.jpeg)) 

Answer 4

정규식 대신 DOM을 사용하는 것이 좋습니다. 한 가지 방법은 가짜 요소를 만드는 것입니다. jQuery로

var fake = document.createElement('div'); 
fake.innerHTML = incomingHTML: // Not really part of JS standard but all the 'main' browsers support it 
var background = fake.childNodes[0].style.background; 
// Now use a regex if need be: /url\(\"?(.*)\"?\)/ 

// If img is at childNodes[1] 
var url = fake.childNodes[1].src; 

이 훨씬 쉽습니다 :

$(incomingHTML).find('img').each(function() { $(this).attr('src'); });