JavaScript中的方法-CSDN博客

本文链接：https://blog.csdn.net/xing_1209/article/details/114634847

JavaScript中的方法

(一) push()方法
- 1. 定义和用法
- 2.实例
(二) Join()方法
- 1. 定义和用法
- 2.实例
(三) splice() 方法
- 1. 定义和用法
- 2.实例
(四) append()方法
- 1. 定义和用法
- 2.实例
(五) unbind()方法
- 1. 定义和用法
- 2.实例
(六) toggle()方法
- 1. 定义和用法
- 2.实例

(一) push()方法

1. 定义和用法

在这里插入图片描述

2.实例

数组中添加新元素:

var fruits = [ "Banana", "Orange", "Apple"， "Mango"];fruits.push("Kiwi")

fruits结果输出:

Banana,orange,Apple,Mango,Kiwi

(二) Join()方法

1. 定义和用法

在这里插入图片描述

2.实例

使用不同的分隔符:

var fruits = ["Banana", "orange", "Apple"， "Mango"];
var energy = fruits.join(" and ");

energy结果输出:

Banana and Orange and Apple and Mango

(三) splice() 方法

1. 定义和用法

在这里插入图片描述

2.实例

移除数组的第三个元素，并在数组第三个位置添加新元素:

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2,1,"Lemon","Kiwi");

fruits 输出结果：

Banana,Orange,Lemon,Kiwi,Mango

(四) append()方法

1. 定义和用法

在这里插入图片描述

2.实例

在所有<p>元素结尾插入内容:

$( document).ready(function(){
	$("#btn1").click(function(){
		$("p").append("<b>插入文本</b>");
	});
	$("#btn2").click(function(){
		$("ol").append("<li>插入项</li>");
	});
});

(五) unbind()方法

1. 定义和用法

在这里插入图片描述

2.实例

function alertMe()
{
	alert("Hello World!");
}
$(document).ready(function(){
  $("p").click(alertMe);
  $("button").click(function(){
    $("p").unbind("click",alertMe);
  });
});

<body>
<p>这是一个段落。</p>
<p>这是另外一个段落。</p>
<p>点击任意一个p元素来触发 alert 弹窗。</p>
<button>移除 p 元素的 click 事件的执行函数 alertMe</button>
</body>

(六) toggle()方法

1. 定义和用法

toggle() 方法切换元素的可见状态。——————— hide() 和 show() 方法之间的切换

如果被选元素可见，则隐藏这些元素，如果被选元素隐藏，则显示这些元素。

2.实例

  $("li").toggle(
    function(){$(this).css({"color":"red"});},
    function(){$(this).css({"color":"blue"});},
    function(){$(this).css({"color":"purple"});},
    function(){$(this).css({"color":"turquoise"});
  });