html部分
注意:type=“number”它会使得输入框内只能输入数字,数字以外的一律无效;
- 这里是直接把forEach()事件打在了button按钮中,num为一个创建的数组,okok为一个函数。
- 在input标签内给的id是便于之后获取输入框内的内容,也可通过属性选择器,标签选择器等等选择器来获取。
- 这里的p标签都需要给id这样便于之后在jQuery中好添加样式,也可以通过基本筛选器来进行获取,方法不唯一
效果图
需要达到的效果是当点击“提交”时,数组内的每个内容都会乘以输入款输入的内容且显示在最后一个p标签内
JQ部分
注意:数组内的对象是从零开始依次增加的,比如.当索引值为零时会获取num数组中的“5”
- function okok(item , index){};
okok为一个函数;item为当前元素;index为当前元素的索引;
·html():取得第一个匹配元素的html内容。这个函数不能用于XML文档。但可以用于XHTML文档。在一个 HTML 文档中, 我们可以使用 .html() 方法来获取任意一个元素的内容。如果选择器匹配多于一个的元素,那么只有第一个匹配元素的 HTML 内容会被获取。
$( “#pp” ).html('<p id="pp">计算之前数组的值为:[' + num + ']</p>');设置id为pp的元素的内容;(这里也可以使用append(),它可以向每个匹配的元素内部追加内容)
- 之后就先通过if()条件语句来判断数组内的索引值,比如:index==0时那就是等于数组内的第一个对象,然后使用id获取器获取第二个p标签,且使用append()在其内追加内容,以此类推,可得到效果。
(提示:最后对<br>是起到了一个换行的作用;)