做web开发前端通常都会使用jQuery这个js库的,通过jQuery来对html元素进行操作是一件很方便的事情,但是不可能将这些操作的方式都记住的包括鄙人,所以一直就想整理一下在日常开发中使用jQuery操作html的文章
免责声明:以下内容均来自于互联网收集整理,如有疑问就有疑问吧! _,对了本篇文章将持续更新
##jQuery对html元素属性操作
jQuery对元素设置属性主要有2个方法prop(),attr()
1.prop:这是高版本jQuery新增的方法,用于操作html元素固有的属性;例如:name、id、value等
2.attr:既可以像prop那样操作固有属性,也能操作我们对html元素自定义的属性;例如:select的option我们定义< option name=‘name’>< /option >这里的name就是我们自定义的属性,只能通过attr来进行操作。
###jQuery控制元素的显示和隐藏
从官网可以看到元素的显示和隐藏通过show()、hide()这两个方法完成
.hide(),官网解释
The matched elements will be hidden immediately, with no animation. This is roughly equivalent to calling .css( “display”, “none” )从这句可以看出来hide本质是上为元素添加了display:none这一css
.show(),官网解释
The matched elements will be revealed immediately, with no animation. This is roughly equivalent to calling .css( “display”, “block” )可以看出show是将元素的display:none修改为display:block,因此该方法也仅适用与通过jQuery隐藏的元素或者该元素display:none属性的元素。
###jQuery获取表单元素的值以及设置表单元素的值
jQuery获取表单元素的值和设置表单元素的值很简单
1.KaTeX parse error: Expected 'EOF', got '#' at position 3: ('#̲element').val()…(’#element).val(‘要设置的值’);
###jQuery使用html()方法
$(selector).html()用于对元素的inner html进行操作,请记住是inner Html
如果html()不带参数这返回该元素的inner html内容,如果带有参数则将该元素的inner html内容替换为参数内容
当然还有更详细的内容
使用函数来设置元素内容
使用函数来设置所有匹配元素的内容。
语法
$(selector).html(function(index,oldcontent))
index - 可选。接收选择器的 index 位置。
oldcontent - 可选。接收选择器的当前内容。