jquery_1

Posted 2020-07-16

jqury

1.alt VS title
when your img does not show up,then you will see the alt on the page;
and when mouseover the img,what you see is title;

2.attr()
get arrtibute value: you can use the function attr("attr_name") to access the attribute;
also,you can set the attribute by the reload function attr("attr_name","attr_value");
example:
var txt = $("#myimg").attr("title"); //get the value of attribute title of myimg;
$("p").attr("text",txt); //then set value of title to all the tag <p>‘s text;

3.addClass()
we can add a defined class to the element of DOM by use to addClass() function;

4.css()
we can access the CSS of DOM elements;
like:$("p").css("background-color","yellow");//to set the background of all <p> to yellow;
$("p").css({color:red,background-color:yellow,font-size:16px});//set multiple css items;

5.removeClass();
remove the class of elements;

6.html()
get the html(contents) of elements(which means the innerHTML);

7.eq()
for DOM traversing,jquery have the function eq(index);
like:seek for the third li of ul:$("li").eq(2); //careful,the selector is not ul but li;

8.filter(selector)
this function allow you to filter out the elements by selector;
like:$("li").filter(".middle").addClass("selected");
//get all the li,then filter out the class = middle,the set their class to seletes;

9.find(selector);
use this function ,we can find the child elements right in the range we get;
like:$("p").find("span").addClass("selected");
//get all the <p> elements,the find all its <span> children elements;

10.width(value),height(value)
set the width or height of selectors;
like:$("div:first").width(100);//set the first div‘s width to 100;

11.html() VS text()
the function html() alaways mathch the innerHTML of the first selector
while the function text() match the innerHTML of all the selectors;

12. dl dt dd;
dictionary list;dictionary theme; dictionary data;

13.replaceWith(content)
replace the innerHTML of selector;
like:$("div").relaceWith("<h1>Hello World!</p>");

14.remove()
remove all the innerHTML of matched selectors；
like:$("div").remove();

15.after(),before();
insert the html after or before the selector;
like:$("div").after("<div class = "myDiv"><p>Hello World!</p></div>");

16.append() VS after()
append() means to append to the selector‘s innerHTML;
while the after() is to insert the selector‘s HTML;