SlideShare una empresa de Scribd logo
1 de 1
Descargar para leer sin conexión
Difference between append() and html() in jQuery

      S.No       jQuery.append()                  jQuery.html()

      1          .append() add some value with    .html() do the same as like
                 the existing one.                .append() but it removes the old
                                                  value.


Here is an example given to understand the practical difference between .append() and
.html(),
<ul id="test">
<li>test</li>
</ul>

Now if .append() is used to add one <li>,as given below

<script type="text/javascript>" jQuery("#test").append("<li>test1</li>"); </script>

The output of this jQuery will be <ul id="test"> <li>test</li> <li>test1</li> </ul>

Now if .html() is used to add one <li>,as provided below

<script type="text/javascript>" jQuery("#test").html("<li>test1</li>"); </script>

The output of this Script will be <ul id="test"> <li>test1</li> </ul>

Here in this example .append() add one extra <li>, whether .html() removes the old one
with new one. This is the main difference between .append() and .html() in Jquery

Reference:

http://chaitanyalella.blogspot.in/2012/03/difference-between-append-and-html-in.html

And, further updates on difference between questions and answers, please visit my
blog @ http://onlydifferencefaqs.blogspot.in/

Más contenido relacionado

Más de Umar Ali

Más de Umar Ali (20)

Affiliate Networks Sites-1
Affiliate Networks Sites-1Affiliate Networks Sites-1
Affiliate Networks Sites-1
 
Technical Video Training Sites- 1
Technical Video Training Sites- 1Technical Video Training Sites- 1
Technical Video Training Sites- 1
 
US News Sites- 1
US News Sites- 1 US News Sites- 1
US News Sites- 1
 
How to create user friendly file hosting link sites
How to create user friendly file hosting link sitesHow to create user friendly file hosting link sites
How to create user friendly file hosting link sites
 
Weak hadiths in tamil
Weak hadiths in tamilWeak hadiths in tamil
Weak hadiths in tamil
 
Bulughul Maram in tamil
Bulughul Maram in tamilBulughul Maram in tamil
Bulughul Maram in tamil
 
Asp.net website usage and job trends
Asp.net website usage and job trendsAsp.net website usage and job trends
Asp.net website usage and job trends
 
Indian news sites- 1
Indian news sites- 1 Indian news sites- 1
Indian news sites- 1
 
Photo sharing sites- 1
Photo sharing sites- 1 Photo sharing sites- 1
Photo sharing sites- 1
 
File hosting search engines
File hosting search enginesFile hosting search engines
File hosting search engines
 
Ajax difference faqs compiled- 1
Ajax difference  faqs compiled- 1Ajax difference  faqs compiled- 1
Ajax difference faqs compiled- 1
 
ADO.NET difference faqs compiled- 1
ADO.NET difference  faqs compiled- 1ADO.NET difference  faqs compiled- 1
ADO.NET difference faqs compiled- 1
 
Dotnet differences compiled -1
Dotnet differences compiled -1Dotnet differences compiled -1
Dotnet differences compiled -1
 
.NET Differences List
.NET Differences List.NET Differences List
.NET Differences List
 
Difference between ajax and silverlight
Difference between ajax and silverlightDifference between ajax and silverlight
Difference between ajax and silverlight
 
Difference between is and as operators in c#
Difference between is and as operators in c#Difference between is and as operators in c#
Difference between is and as operators in c#
 
Difference between c# generics and c++ templates
Difference between c# generics and c++ templatesDifference between c# generics and c++ templates
Difference between c# generics and c++ templates
 
Var vs iEnumerable
Var vs iEnumerableVar vs iEnumerable
Var vs iEnumerable
 
Differences between get children() and getdescendants() methods
Differences between get children() and getdescendants() methodsDifferences between get children() and getdescendants() methods
Differences between get children() and getdescendants() methods
 
Ruby on rails vs asp.net mvc
Ruby on rails vs asp.net mvcRuby on rails vs asp.net mvc
Ruby on rails vs asp.net mvc
 

Último

CNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of ServiceCNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of Service
giselly40
 
IAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI SolutionsIAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI Solutions
Enterprise Knowledge
 

Último (20)

Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
 
Strategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a FresherStrategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a Fresher
 
Presentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreterPresentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreter
 
Tech Trends Report 2024 Future Today Institute.pdf
Tech Trends Report 2024 Future Today Institute.pdfTech Trends Report 2024 Future Today Institute.pdf
Tech Trends Report 2024 Future Today Institute.pdf
 
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time AutomationFrom Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
 
CNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of ServiceCNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of Service
 
Handwritten Text Recognition for manuscripts and early printed texts
Handwritten Text Recognition for manuscripts and early printed textsHandwritten Text Recognition for manuscripts and early printed texts
Handwritten Text Recognition for manuscripts and early printed texts
 
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024
 
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
 
[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf
 
Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...
 
Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024
 
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 
IAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI SolutionsIAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI Solutions
 
🐬 The future of MySQL is Postgres 🐘
🐬  The future of MySQL is Postgres   🐘🐬  The future of MySQL is Postgres   🐘
🐬 The future of MySQL is Postgres 🐘
 
Scaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organizationScaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organization
 
Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfBoost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdf
 
Evaluating the top large language models.pdf
Evaluating the top large language models.pdfEvaluating the top large language models.pdf
Evaluating the top large language models.pdf
 
GenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day PresentationGenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day Presentation
 

Jquery.append() vs jquery.html()

  • 1. Difference between append() and html() in jQuery S.No jQuery.append() jQuery.html() 1 .append() add some value with .html() do the same as like the existing one. .append() but it removes the old value. Here is an example given to understand the practical difference between .append() and .html(), <ul id="test"> <li>test</li> </ul> Now if .append() is used to add one <li>,as given below <script type="text/javascript>" jQuery("#test").append("<li>test1</li>"); </script> The output of this jQuery will be <ul id="test"> <li>test</li> <li>test1</li> </ul> Now if .html() is used to add one <li>,as provided below <script type="text/javascript>" jQuery("#test").html("<li>test1</li>"); </script> The output of this Script will be <ul id="test"> <li>test1</li> </ul> Here in this example .append() add one extra <li>, whether .html() removes the old one with new one. This is the main difference between .append() and .html() in Jquery Reference: http://chaitanyalella.blogspot.in/2012/03/difference-between-append-and-html-in.html And, further updates on difference between questions and answers, please visit my blog @ http://onlydifferencefaqs.blogspot.in/