자바 스크립트로 CSS 글꼴 크기를 더하거나 빼는 방법은 무엇입니까?

Question

나는 css font-size가 지정되었는지 여부에 관계없이 데이터베이스에 저장된 html을 사용자에게 제공합니다.

그리고 doms의 글꼴 크기를 늘리거나 줄이려면 버튼을 만들되, 상대 크기는 으로 유지하십시오.

변수 def_size를 16px로 정의하고 cur_size를 기본 크기로 즉시 정의했습니다.

하지만 미리 정의 된 크기의 DOM을 처리하는 방법을 알지 못합니까? preg_replace를 시도했지만 실패했습니다.

http://jsfiddle.net/95kDZ/

function change_font_size(csize){ 
var $cotent_html=$('.content'); 
cur_base=cur_base+csize; 
//without style,just add the css to the whole div" 
    $cotent_html.css('font-size',cur_base.toString()+'px'); 
/* 

Answer 1

내가 텍스트 포함 할 수있는 모든 요소를 ​​얻을 필요가 있다고 생각 몇 가지 hint.Thanks 나에게주십시오 : 등 p, span, div를, 그리고 그것에 당신의 font-size 논리를 적용에게 대신 전체 html 루트에. 스타일을 덮어 쓰려면 특정 html 요소를 타겟팅해야합니다.

업데이트 된 작업용 here.

코드 :

이

var def_size=16, 
    cur_base=def_size; 

$('input[type="button"]').click(function() { 
    change_font_size(parseInt($(this).data('csize'))); 
}); 

function change_font_size(csize){ 
    var $cotent_html=$('.content'); 

    cur_base=cur_base+csize; 
    //without style,just add the css to the whole div" 
    $cotent_html.find('span, p, div').css('font-size', cur_base.toString()+'px'); 
} 

Answer 2

foreach는 기능이 업데이트됩니다 다음은이

더 나은 것 fiddle

코드 :

function change_font_size(csize){ 
    var $content_html=$('.content p, .content span'); 
    $content_html.each(function(){ 
     var cur_size = parseInt($(this).css('font-size')); 
     cur_size += csize; 
     console.log(cur_size); 
     $(this).css('font-size', cur_size.toString()+'px'); 
    }); 

}