js与jq

最新推荐文章于 2024-03-06 14:34:17 发布

夏尔子爵

最新推荐文章于 2024-03-06 14:34:17 发布

阅读量122

点赞数

本文链接：https://blog.csdn.net/weixin_49074309/article/details/117933783

版权

一javascript
1引入方式

<script type="text/javascript">
 
</script>
2常用函数
JS获取元素
```html
document.getElementById( id值 )

通过元素的id值，获取一个元素。返回的是表示该元素的js对象。

document.getElementsByTagName( 元素名 )

通过元素名称获取当前文档中的所有指定名称的元素，返回的是一个数组，其中包含了所有指定名称的元素。

document.body

获取当前文档中的body元素

ele.parentNode

获取当前元素的父元素。ele表示当前元素
JS增删改元素

document.createElement( 元素名称 )

根据元素名称创建指定名称的元素，返回的是表示新创建元素的js对象

parent.appendChild( child )

通过父元素添加子元素，其中parent表示父元素，child表示子元素

parent.removeChild( child )

通过父元素删除子元素，其中parent表示父元素，child表示子元素

ele.innerHTML

获取当前元素的html内容(从开始标签到结束标签之间的所有内容)，还可以设置当前元素的html内容(如果元素内部有内容，将会覆盖原有内容)
二jquery
1引入方式

<script src="js/jquery-1.8.3.js"></script>
<script>

</script>

2jQuery事件绑定

<script>
$(function(){
    //当点击btn按钮时,触发点击事件执行其中的函数
    $("#btn").click( **function**(){
        alert("input按钮被点击了...");
    });
});
</script>
<body>
  <input id=*"btn" type="button" value="点我~!" /\>
</body>

3常用函数

$("<div></div>")

创建一个div元素，返回的是一个表示div元素的jQuery对象

$("<div>xxxx</div>")

创建一个包含内容的div元素，返回的是一个表示div元素的jQuery对象

$parent.append( $child )

父元素调用方法添加子元素

$("body").append( "<div>我是新来的...</div>" )

往body元素内部追加一个div子元素

$("div").remove()

删除所有的div元素

$("div").replaceWith("<p>我是来替换的…</p>")

替换元素

$("div").html()

获取所有div中的第一个div的内容

$("div").html("xxxx")

为所有div设置内容

$("div").text()

获取所有div中的所有文本内容

$("div").text("xxxx")

为所有div设置文本内容

$("input").val()

获取所有input元素中的第一个input元素的value值

$("input").val(值)

为所有的input元素设置value值

$("input[type='checkbox']").prop("checked")

获取input复选框的选中状态, 返回true表示复选框为选中状态,返回false表示复选框为取消选中状态

$("input[type='checkbox']").prop("checked", true)

设置所匹配的复选框元素为选中状态

$("#div1").css("width")

获取id为div1元素的宽度

$("#div1").css("width","200px")

设置id为div1元素的宽度为200px

$("#div1").css({
  "width" : "200px",
  "height" : "150px",
  "border" : "5px solid red",
  "background" : "pink"
})

设置id为div1元素的宽度为200px、高度为150px、边框以及背景颜色等样式

$("div").show()

设置所有的div元素为显示

$("div").hide()

设置所有的div元素为隐藏

夏尔子爵

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
js与jq

一javascript二jquery
复制链接

扫一扫