Jquery: How to Get Assigned Font to Element

jQuery - Get all elements in body font sizes

1. How to find elements just within body?

You can use jQuery find() method off a selection of the body to accomplish this:

$('body').find('*');

2. Other Issues?

So, ultimately the code as you have it isn't really "filtering" out anything in your call to $.inArray(...) because the jQuery object for each element of the DOM will be unique.

I've taken a stab at the issue assuming you you want to store the "tag name" of the item (e.g. DIV, H2, H3, etc). I don't believe jQuery $.inArray() works with objects (or... I can't get it to work on my machine) so I simplified using the Array.prototype.some() method which will accomplish what you are looking to do:

var elements = $("body").find("*"),
    fontSizeArray = [];

elements.each(function() {
    var obj = {
            element: $(this).prop('tagName'),
            originalSize: $(this).css("font-size"),
            size: $(this).css("font-size")
        };
    if (!fontSizeArray.some(function(item) {
            return item.element === obj.element &&
                item.originalSize === obj.originalSize &&
                item.size === obj.size;
        })) {
        fontSizeArray.push(obj);
    }
});

console.log(fontSizeArray);

set font size in jquery

Try:

$("#"+styleTarget).css({ 'font-size': $(this).val() });

By putting the value in quotes, it becomes a string, and "+$(this).val()+"px is definitely not close to a font value. There are a couple of ways of setting the style properties of an element:

Using a map:

$("#elem").css({
    fontSize: 20
});

Using key and value parameters:

All of these are valid.

$("#elem").css("fontSize", 20);
$("#elem").css("fontSize", "20px");
$("#elem").css("font-size", "20");
$("#elem").css("font-size", "20px");

You can replace "fontSize" with "font-size" but it will have to be quoted then.

how to change text value within an element?

Do it with jQuery inside of a document ready handler ($(fn))...

$('.post-read a').text('continue reading');

jsFiddle.

For the sake of it, here is how to do it without jQuery....

var anchor = document.getElementsByClassName('post-read')[0].getElementsByTagName('a')[0],
    textProperty;

if (anchor.textContent) {
    textProperty = 'textContent';
} else if (anchor.innerText) {
    textProperty = 'innerText';
}
anchor[textProperty] = 'continue reading';

jsFiddle.

This will work good for your piece of HTML, but it isn't too generic.

If you don't care about setting innerText property, you could use...

anchor.textContent = anchor.innerText = 'continue reading';

I wouldn't recommend it though.

How to change id font-size using jQuery .attr()?

To manage the style of an element using jQuery you have to use .css()

$("#level-title").css("font-size", "1rem");

Though, not preferred, you can still use attr() by setting the style attribute:

$("#level-title").attr("style", "font-size: 1rem");

Getting font css property does not work in IE and Firefox with jQuery

You'll have to query the individual font-* properties you're interested in. From the css documentation:

Retrieval of shorthand CSS properties (e.g., margin, background, border), although functional with some browsers, is not guaranteed. For example, if you want to retrieve the rendered border-width, use: $( elem ).css( "borderTopWidth" ), $( elem ).css( "borderBottomWidth" ), and so on.

Using .text() to retrieve only text not nested in child tags

I liked this reusable implementation based on the clone() method found here to get only the text inside the parent element.

Code provided for easy reference:

$("#foo")
    .clone()    //clone the element
    .children() //select all the children
    .remove()   //remove all the children
    .end()  //again go back to selected element
    .text();

How can i get default font size in pixels by using JavaScript or JQuery?

There are a couple of situations this can be useful-

function getDefaultFontSize(pa){
 pa= pa || document.body;
 var who= document.createElement('div');

 who.style.cssText='display:inline-block; padding:0; line-height:1; position:absolute; visibility:hidden; font-size:1em';

 who.appendChild(document.createTextNode('M'));
 pa.appendChild(who);
 var fs= [who.offsetWidth, who.offsetHeight];
 pa.removeChild(who);
 return fs;
}

alert(getDefaultFontSize())

---

Related Topics